3D(R3F)

mesh : r3f에서 랜더링할 3차원 모델을 mesh라고 한다.rotation : 회전하는 각도를 radian으로 하기 위해서 (Math.PI) / 180를 하고 있는데 THREE.MathUtils.degToRad(45)로 해도 똑같은 결과를 얻을 수 있다.useFr

Drei : R3F에서 사용할 수 있는 유용한 컴포넌트들을 모아 놓은 라이브러리지오메트리는 mesh의 모양을 정의하는거 말고도 다른용도로도 사용되지만 이번엔 모양에 대해서만 정리모든 지오메트리는 BufferGeometry 클래스를 상속받는다. BufferGeometry

three.js에서 제공하는, Material 클래스 drei 라이브러리에서 제공하는 Material 클래스 three.js에서 제공하는, Material 클래스 meshStandardMaterial 의 속성들 color : default/"white" visi

광원의 색상과 밝기 쌔기값을 속성으로 줄 수 있다.태양과 같은 광원광원의 위치와 물체와의 거리와 상관없이 특정(일정)한 방향으로 향하는 빛directionalLight의 position 위치에서 원점까지의 방향으로 결정광원 위치 눈으로 확인하는 방법광원 useRef로

카메라 종류 Perspective Camera, Orthographic Camera 둘다 절두체라는 개념이 존재 카메라 생성을 위한 파라미터(절두체를 정의하기 위한 값들) Perspective Camera OrbitControls - 카메라를 내부적으로 관리하는

그림자는 빛의 의해서 만들어진다.사용 전 Canvas에 shadows속성 추가directionalLight이 그림자를 만들라고 해야하기 때문에 Light에 castShadow속성 추가mesh에 그림자 관련 속성 추가바닥면은 그림자를 받아서 자신의 표면에 그림자를 표시해

R3F에서 지원하는 3D 모델 파일 형식중 가장 많이 사용하는 형식은 3DS, FBX, glTF, OBJ이다. 특히 glTF는 khronos Group에서 표준으로 효율성이 아주 뛰어난 형식이다.우선 3D모델 데이터를 구해야된다.예시 사이트 ) https:/

랜더링된 결과에 어떤 추가적인 효과를 적용하는 것R3F에서 제공하는 Postprocessing에 대한 내용https://docs.pmnd.rs/react-postprocessing/effect-composerEffectComposer는 효과를 구성하고 적용하는

glb -> jsx변환 및 재사용 glb, gltf 파일을 jsx형식으로 재사용할 수 있게 해주는 라이브러리(해당 파일이 있는 곳으로 터미널 이동 한다음 명령어 입력) 변환이 종료되면 glb가 있던 폴더에 jsx파일로 생김 -> component로 이동

useLoader는 three.js의 모든 로더를 사용할 수 있도록 일반화된 훅. GLTFLoader, FBXLoader, TextureLoader 등 다양한 유형의 로더와 함께 사용될 수 있음.로더의 종류를 첫 번째 인자로, 로딩할 파일의 경로를 두 번째 인자로 전달