profile
개발공부 막 시작했습니다 틀린정보가 있을경우 알려주시면 감사하겠습니다

230421 TIL :: three.js Material, Light

TextureLoader : 3d texture이미지를 material에 적용가능 CubeTextureLoader : 외부에서 받아온 이미지 파일을 Material의 적용하여 마치 mesh가 받아온 이미지들에 둘러싸여 있는듯한 느낌을 줌 Material 처리해야할 속성이 많을수록 처리할 연산이 많다는 뜻 적절한 곳에 필요한것을 사용하자 MeshBasicMaterial : 빛, 그림자 영향을 안받는 Material 그래서 입체감이 없다 MeshLambertMaterial : 하이라이트, 반사광 없는 재질 MeshPhongMaterial : 하이라이트, 반사광 표현 및 조정이 가능 MeshStandardMaterial : MeshPhongMaterial에 metalness라는 철 처럼 보이는 느낌을 추가하는 속성이 있는 Material MeshToonMaterial : 만화같은 느낌이 나는 Material MeshNormalMaterial : 각도마다 다른 색상을 보여주는

2023년 4월 21일
·
0개의 댓글
·
post-thumbnail

230420 TIL :: three.js 몇몇 라이브러리 및 컨트롤 관련

ambientLight : 은은하게 전체적으로 빛을 비춤 axesHelper : 3차원 축을 화면에 그려 기준을 잡기 편하게 함 gridHelper : 바닥에 격자를 화면에 그려 기준을 잡기 편하게 함 stats.js : FPS를 띄어서 초당 프레임 체크가 가능하게 해주는 라이브러리 dat.gui : 자바스크립트의 속성값을 그래픽으로 조정할수 있게 해주는 라이브러리 group : 여러개의 매쉬를 그룹이어서 조정가능하게 함 그룹을 사용하여 만들어본 회전 하는 구들 컨트롤 OrbitControls : 마우스휠로 확대,축소 및 드래그로 회전을 할수 있다 TrackballControls : OrbitControls 기능에 추가적으로 우클릭시 위치 이동 같은 기능들 추가된 카메라 FlyControl

2023년 4월 20일
·
0개의 댓글
·
post-thumbnail

230419 TIL :: three.js 첫 시작

three.js 기본 구성요소 Scene : 오브젝트들이 있는 공간 (카메라, 빛, 메쉬 등등) Mesh : 웹에서 직접 보여줄 요소, Geometry(모양)과 Material(재질)로 구성되어 있음 Camera : 사용자가 볼 화면을 찍고 있는 카메라 Renderer : 카메라가 찍은 화면을 사용자 화면에 그림 Light : 재질에 따라 빛이 있어야 보이는게 있기도 함 입력할 값들의 단위는 정해져 있지 않음 즉 제작자가 1은 1m다 라는 기준을 잡고 하면 그것이 단위가 되는것이다 Camera PerspectiveCamera : 3D 장면을 렌더링하는데 가장 널리 쓰이는 투영 모드 fov : 카메라의 시야각 aspect : 카메라의 가로,세로 비율 near : 카메라 기준 어느지점부터 보이게 할껀지 (설정 값 보다 가까이 있으면 존재한다고 해도 안보임) far : 카메라 기준 어느지점부터 안보이게 할껀지 (설정 값 보다 멀리 있으면 존재한다고 해도 안보임

2023년 4월 19일
·
0개의 댓글
·