Interactive/three.js
-
설치 - 시작하기 | Three.jsInteractive/three.js 2021. 2. 8. 12:49
three.js는 npm을 포함한 빌드 툴에서 설치가 가능하고, CDN이나 static 호스팅으로 빠르게 사용이 가능합니다. 대부분의 경우 npm을 통한 설치가 가장 좋은 선택입니다. 어떤 방식을 선택하든, 같은 버전의 라이브러리에서 모든 파일을 동일하게 불러와야 합니다. 여러 소스에서 파일을 혼합해 가져오면 코드 중복이 일어나거나 비정상적으로 앱이 종료될 수 있습니다. three.js의 모든 메서드들은 ES modules (Eloquent JavaScript: ECMAScript Modules 참조)에 기반하고 있으며, 마지막 프로젝트에 필요한 부분만 불러오도록 할 것입니다. npm으로 설치하기 three npm 모듈을 설치하려면, 프로젝트 폴더의 터미널을 열고 다음을 실행합니다. npm install..
-
장면 만들기 - 시작하기 | Three.jsInteractive/three.js 2021. 1. 18. 12:01
이 장의 목표는 three.js에 대한 간략한 설명을 하는 것입니다. spinning cube라는 장면을 설정하는 것부터 시작할 것입니다. 막히거나 도움이 필요할 때에는 아래쪽의 실습 예제를 확인해주세요. 시작하기 전에 three.js를 사용하려면, 표시할 수 있는 공간이 필요합니다. 다음과 같이 HTML 파일을 만들고, js/ 디렉토리 안에 three.js 파일을 만들고 연결시켜 웹 브라우저로 실행해주세요. 이게 전부입니다. 모든 코드들은 비어있는 태그 안에 작성될 것입니다. 장면 만들기 three.js로 무언가를 표현하려면 scene, camera 그리고 renderer가 필요합니다. 이를 통해 카메라로 장면을 구현할 수 있습니다. const scene = new THREE.Scene(); const..