이 자습서에서는 3.js 다운로드에 포함된 OrbitControls.js라는 파일도 필요합니다. 다음은 파일 경로입니다. CodePen에서 JSON 데이터를 다른 펜에 저장한 다음 3.js 장면이로드된 기존 펜에 연결할 수 있습니다. 그리고 그게 다야! 앱에 3.js가 포함되어 있으므로 시작할 준비가 되었습니다! 3.js는 NPM에서 패키지로도 사용할 수 있습니다. 즉, 컴퓨터에 Node.js 및 NPM을 설정한 경우 명령 프롬프트를 열고 입력할 수 있습니다. 클릭하고 카메라를 궤도 마우스를 드래그! 마우스휠을 사용하여 확대 및 축소할 수도 있습니다. 자바 스크립트 응용 프로그램에 three.js를 포함하는 몇 가지 다른 방법이 있습니다, 그들 중 일부는 간단, 그들 중 일부는 조금 더 복잡, 그러나, 그들은 모두 하나의 간단한 아이디어로 귀결 : 당신은 당신의 프로젝트에이 세 가지 파일 중 하나 (그리고 하나)를 포함해야합니다 : 나는이 언젠가 를 통해 작업해야합니다; 나는 잠시 동안 세.js를 체크 아웃하는 것을 의미했습니다. 실제로 WebGL의 또 다른 3D 프레임 워크인 Babylon.js이번 주말에 약간의 고민을 하고 있었습니다. 귀하 또는 다른 사람이 둘 다와 함께 일했습니까? Three.js는 WebGL 프레임워크의 명백한 선두 주자처럼 보이지만 다른 사람들이 이 프레임워크에 대해 어떻게 생각하는지 듣고 싶습니다. 이 작업을 수행 하면 모델을 볼 수 없습니다 제외 하 고 작동 하는 것 같다, 심지어 코드를 다운로드 하 고 index.html 파일을 실행 하지만 여전히 treehouse_logo.js를 읽을 수 없습니다. 검사관은 나에게 이러한 오류를 제공합니다 : 1) XMLHttpRequest는 file:///Users/anthonylowenfeld/Downloads/threejs_logo_example/models/treehouse_logo.js로드 할 수 없습니다.

교차 원본 요청은 http, 데이터, 크롬, 크롬 확장, https, 크롬 확장-리소스 등 프로토콜 체계에 대해서만 지원됩니다. 다음으로, 우리는 3.js 렌더러를 설정합니다. SVG 또는 캔버스 렌더러를 사용할 수 있지만 GPU를 활용할 수 있기 때문에 WebGL 렌더러를 사용하려고 하므로 몇 가지 성능이 더 우수합니다.