728x90 분류 전체보기152 Geometries Geometries 도형의 거리, 모양, 크기 및 상대 위차와 같은 공간의 속성과 관련된 수학의 한 분야이다. 물리적 세계를 모델링하기 위해 개발된 기하학은 거의 모든 과학과 예술, 건축 및 그래픽 과 관련된 기타 활동에 적용된다. Three.js 에는 일반적인 도형을 만들기 위한 많은 클래스가 있다 그중에서 3가지 Geometry 살펴볼 생각이다. BoxGeometry BoxGeometry는 주어진 '너비', '높이', '깊이'가 있는 직육면체의 기하학 클래스이다. 생성 시 각 모서리가 축 중 하나와 평행한 상태에서 원점의 중심에 배치된다. BoxGeometry(width : Float, height : Float, depth : Float, widthSegm.. 2023. 7. 25. Object3D Hierarchy Object3D는 Three.js의 많은 개체에 대한 기본 클래스로 3D 공간에서 개체를 조작하기 위한 메서드와 속성을 제공한다 가장 일반적인 ex) 메쉬, 조명, 카메라 및 Object3D 이다 https://threejs.org/docs/#api/en/core/Object3D three.js docs threejs.org 장면에 다른 Object3D 추가할수 있으면 부모 Object3D의 add() 메소드를 통해서 자식 Object3D를 만들수 있다 const object1 = new THREE.Mesh( new THREE.SphereGeometry(), new THREE.MeshPhongMaterial({ color: 0xff0000 }) // 빨강 ) object1.position.set(4, 0.. 2023. 7. 24. 빅오(Big-O) 표기법 빅오알고리즘의 성능을 수학적으로 표현해주는 표기법시간과 공간복잡도를 표현할수 있다데이터나 사용자의 증가율에 따른 알고리즘의 성능을 예측하는게 목표 (상수는 무시)O(1)F(int[] n){ return (n[0] == 0)? true:false;}입력 데이터 크기의 상관없이 일정한 시간이 걸리는 알고리즘인자로 받는 배열 값이 얼마나 큰지 상관없이 일정한 속도로 반환한다O(n)F(int[] n){ for i = 0 to n.length print i }입력데이터 크기에 비례해서 처리시간이 걸리는 알고리즘n개의 데이터를 받으면 n번 루프돌아서 n이 1씩 늘어날때마다 처리가 한번씩 늘어난다O(n²)F(int[] n){ for i = 0 to n.length for j .. 2023. 7. 24. Dat GUI Dat.GUI 는 Three.js 에 대해 배우는데 사용하는 매우 유용한 도구 이다 설치 dat.gui 받아오기 npm install dat.gui --save-dev이제 기존 javascript 파일에 가져온다 import { GUI } from 'dat.gui' threejs 에서 따로 제공해주는 gui import { GUI } from "three/examples/jsm/libs/lil-gui.module.min" x,y,z 적용하기 x,y,z 기준으로 회전값을 설정해 준다 const gui = new GUI() const cubeFolder = gui.addFolder("Cube"); const cubeRotationFolder = cubeFolder.addFolder("Rotat.. 2023. 7. 21. ThreeJS 시작하기 NPM 및 빌드 도구로 설치 npm 패키지 레지스트리 에서 설치하고 빌드 도구를 사용한다 Node.js 설치하기 종속성 관리를 로드하고 빌드 도구를 실행하는 필요하다 프로젝트 폴더의 터미널 을 사용하여 three.js 및 빌드 도구인 Vite를 설치한다 npm init # three.js npm install --save three # vite npm install --save-dev vite npm은 package.json 사용하여 설치한 각 종속성의 버전을 설명한다. 프로젝트에서 함께 작업하는 다른사람이 있는 경우 npm install 실행하여 각 종속성의 원래 버전을 설치할수 있다. 버전 기록을 사용하는 경우 package.json 커밋을 한다 node_modules 폴더는 각 종속성에 대한 코드를.. 2023. 7. 20. PerspectiveCamera vs OrthographicCamera PerspectiveCamera 인간의 눈이 보는 방식을 모방하도록 설계되어 있으며 3D 장면을 렌더링 하는데 사용되는 가장 일반적인 프로젝션 모드 카메라 이다 PerspectiveCamera( fov : Number , aspect : Number , near : Number , far : Number ) fov: 카메라 절두체 시야 영역 aspect: 카메라 절두체 종횡비 near: 평면 근처의 카메라 절두체 far: 카메라 절두체 원거리 평면 https://commons.wikimedia.org/wiki/File:Perspective_view_frustum.png# File:Perspective view frustum.png - Wikimedia Commons --> commons.wikimedia.. 2023. 7. 19. 이전 1 ··· 3 4 5 6 7 8 9 ··· 26 다음 728x90
