1、查看版本:
在console中輸入:
THREE.REVISION
查看。
2、初始化:
在Three.js中,要渲染物體到網頁中,我們需要3個組建:場景(scene)、相機(camera)和渲染器(renderer)。
var scene = new THREE.Scene(); // 場景
var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);// 透視相機
var renderer = new THREE.WebGLRenderer(); // 渲染器
renderer.setSize(window.innerWidth, window.innerHeight); // 設置渲染器的大小爲窗口的內寬度,也就是內容區的寬度
document.body.appendChild(renderer.domElement);
場景是所有物體的容器,如果要顯示一個蘋果,就需要將蘋果對象加入場景中。
相機決定了場景中那個角度的景色會顯示出來。相機就像人的眼睛一樣,人站在不同位置,擡頭或者低頭都能夠看到不同的景色。
渲染器renderer的domElement元素,表示渲染器中的畫布,所有的渲染都是畫在domElement上的,所以這裏的appendChild表示將這個domElement掛接在body下面,這樣渲染的結果就能夠在頁面中顯示了。