wam
w__am 개발노트
wam
  • 분류 전체보기 (165)
    • CS 지식 (10)
      • 자료구조 (0)
      • 알고리즘 (0)
      • 컴퓨터 구조 (0)
      • 운영체제 (0)
      • 네트워크 (7)
      • 데이터베이스 (0)
      • 디자인 패턴 (3)
    • Frontend (131)
      • Three.js (64)
      • NPM (1)
      • Nest.js (19)
      • React (10)
      • Apollo (7)
      • TypeScript (2)
      • JavaScript (12)
      • HTML, CSS (1)
      • Jest (3)
      • E2E (5)
      • Cypress (7)
    • Database (12)
      • TypeORM (12)
    • IT 지식 (8)
      • 클라우드 서비스 (3)
      • 네트워크 (1)
      • 데이터 포맷 (2)
      • 기타 (2)
    • IT Book (2)
    • 유용한 사이트 (1)

블로그 메뉴

  • 홈
  • 태그
  • 방명록
  • 🐱 Github

인기 글

태그

  • math.sin()
  • getdelta()
  • axeshelper
  • 삼각함수
  • getelapsedtime()
  • 스코프
  • mapped types
  • 렌더링 성능 최적화
  • Interface
  • three.js 구성 요소
  • 초기 환경설정
  • 함수 표현식
  • e.preventdefault()
  • react 성능 최적화
  • reactive variables
  • 원형적인 움직임
  • 오프-프레미스(off-premise) 방식
  • math.cos()
  • 함수의 범위
  • Decorators
  • 함수 선언문
  • type-graphql
  • joi 에러
  • threejs 개발 할 때 도움을 줄 수 있는 유틸리티
  • gridhelper
  • 데이터 포맷
  • isabstract
  • 함수 리터럴
  • 디자인 패턴
  • API

최근 글

관리자

글쓰기 / 스킨편집 / 관리자페이지
hELLO · Designed By 정상우.
wam

w__am 개발노트

재질, MeshLambertMaterial, MeshPhongMaterial
Frontend/Three.js

재질, MeshLambertMaterial, MeshPhongMaterial

2024. 9. 30. 02:29

 

MeshLambertMaterial

  • 조명이 있는 환경에서 사용할 수 있는 기본적인 재질이다.
  • 확산 반사(diffuse reflection)를 사용해서 빛을 계산한다.
  • 광택이나 반사가 없다.
  • 비교적 가벼운 계산을 요구하기 때문에 성능이 중요한 경우에 적합하다.

 

 

MeshPhongMaterial

  • Phong 쉐이딩을 사용하는 재질로, 광택과 반사를 처리할 수 있다.
  • 스펙큘러 반사(specular reflection, 하이라이트)를 표현할 수 있어서 금속, 유리 등과 같은 광택이 있는 표면을 표현하는 데 적합하다.
  • MeshLambertMaterial보다 더 복잡한 계산을 요구하지만, 더 사실적인 결과를 제공한다.

두 재질 모두 빛과의 상호작용을 기반으로 하지만, MeshLambertMaterial은 단순한 확산 반사를 제공하고, MeshPhongMaterial은 광택 있는 표면을 표현할 수 있다는 차이가 있다.

 

 

MeshLambertMaterial과 MeshPhongMaterial의 차이점

 

 

MeshLambertMaterial

MeshPhongMaterial

쉐이딩 방식 Lambert 쉐이딩 (확산 반사) Phong 쉐이딩 (스펙큘러 반사 포함)
빛 반사 확산 반사 (Diffuse Reflection) 확산 반사 + 스펙큘러 반사 (Diffuse + Specular)
광택 표현 없음 있음 (스펙큘러 하이라이트 표현 가능)
계산 복잡도 낮음 (가벼운 재질, 성능 효율적) 높음 (복잡한 계산, 더 사실적인 표현)
적합한 경우 성능이 중요한 경우, 단순한 표면 표현에 적합 금속, 유리 등 광택이 있는 표면 표현에 적합

 

 

두 재질은 3D 객체의 표면에 어떻게 빛이 반사되고 표현될지를 결정해 준다.

 

 

 

저작자표시 변경금지 (새창열림)

'Frontend > Three.js' 카테고리의 다른 글

재질, flatShading - 각지게 표현  (0) 2024.10.16
재질, MeshStandardMaterial (MeshPhongMaterial과 비교)  (0) 2024.09.30
재질, MeshBasicMaterial  (0) 2024.09.30
카메라 컨트롤, Minecraft Controls  (0) 2024.09.05
카메라 컨트롤, DragControls  (0) 2024.09.05
    'Frontend/Three.js' 카테고리의 다른 글
    • 재질, flatShading - 각지게 표현
    • 재질, MeshStandardMaterial (MeshPhongMaterial과 비교)
    • 재질, MeshBasicMaterial
    • 카메라 컨트롤, Minecraft Controls
    wam
    wam

    티스토리툴바