flatShading 속성
// MeshPhongMaterial, 상대적으로 덜 사실적
const material1 = new THREE.MeshPhongMaterial({
color: "orangered",
shininess: 800,
flatShading: true
});
// MeshStandardMaterial, 고품질의 사실적인 렌더링
const material2 = new THREE.MeshStandardMaterial({
color: "orangered",
roughness: 0.2,
metalness: 0.3,
flatShading: true
});
- flatShading 속성은 평면 셰이딩(Flat Shading)을 활성화할지 여부를 결정하는 Boolean 값이다.
- 이 값이 true로 설정되면, 각 면(Face)에 대해 개별적으로 정규 벡터가 계산되어 면이 평평하게 보이게 된다.
- 이때 각 삼각형의 면이 뚜렷하게 드러나기 때문에 물체가 더 각지게 보이게 된다.
- flatShading이 false일 경우(기본값), 모든 면에 대해 부드러운 셰이딩(Smooth Shading)이 적용되어 정점 간의 노멀 벡터를 보간해 부드러운 표면을 표현하게 된다.
'Frontend > Three.js' 카테고리의 다른 글
재질, 텍스쳐 이미지 로드하기 (0) | 2024.10.16 |
---|---|
재질, side - Mesh의 앞 뒷면 (0) | 2024.10.16 |
재질, MeshStandardMaterial (MeshPhongMaterial과 비교) (0) | 2024.09.30 |
재질, MeshLambertMaterial, MeshPhongMaterial (0) | 2024.09.30 |
재질, MeshBasicMaterial (0) | 2024.09.30 |