1.下載three.js庫。https://github.com/mrdoob/three.js/
第一步：新建一個項目文件夾“Threejs”
第二步：在Threejs文件夾內新建一個html文件（index.html）。該文件是通過瀏覽器進入游戲的入口。
第三步：在Threejs文件夾內新建一個libs文件夾，用來存放three.js庫和需要用到的其他庫。
第四步：在Threejs文件夾內新建一個images文件夾，用來存放需要素材。
第五步：在Threejs文件夾內新建一個js文件夾，用來存放我們開發項目寫的腳本。
index.html文件
<!DOCTYPE html> <html> <head> <title>three.js</title> <script src="libs/three.js"></script> <script src="js/main.js"></script> <style> body { margin: 0; overflow: hidden; } </style> </head> <script> </script> <body> </body> </html>
three.js文件 在目錄下建立libs文件夾，把three,js拷貝進去
https://raw.githubusercontent.com/mrdoob/three.js/master/build/three.js
main.js文件
var renderer;//渲染器 var scene;//場景 var camera;//相機 function init() {//init()函數是我們整個項目的入口，類似我們平時編程時的main函數。 scene = new THREE.Scene();//場景 camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000);//相機 renderer = new THREE.WebGLRenderer();//渲染 renderer.setClearColor(0x000000, 1.0); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); render(); } function render() { requestAnimationFrame(render); renderer.render(scene, camera); } window.onload = init;
漆黑一片。因為我們還沒向場景添加任何東西。