three.js所繪製簡單的三角形

我試圖繪製三角形three.js所：three.js所繪製簡單的三角形

var scene = new THREE.Scene(); 

var camera = new THREE.PerspectiveCamera(40, window.innerWidth/window.innerHeight, 1, 1000); 
camera.position.z = 100; 
scene.add(camera); 

var renderer = new THREE.WebGLRenderer(); 
renderer.setSize(window.innerWidth, window.innerHeight); 
document.body.appendChild(renderer.domElement); 

var geom = new THREE.Geometry(); 
var v1 = new THREE.Vector3(0,0,0); 
var v2 = new THREE.Vector3(30,0,0); 
var v3 = new THREE.Vector3(30,30,0); 

console.log(geom.vertices) 
geom.vertices.push(new THREE.Vertex(v1)); 
geom.vertices.push(new THREE.Vertex(v2)); 
geom.vertices.push(new THREE.Vertex(v3)); 

geom.faces.push(new THREE.Face3(0, 1, 2)); 
geom.computeFaceNormals(); 

var mesh= new THREE.Mesh(geom, new THREE.MeshNormalMaterial()); 
scene.add(mesh); 

renderer.render(scene, camera);

但並沒有什麼在屏幕上。但是這些例子的工作： http://threejs.org/docs/58/#Manual/Introduction/Creating_a_scene https://github.com/tonylukasavage/jsstl（三角形在這裏創建我試圖做同樣的方式）

能否請你幫我找到了問題？謝謝， Ievgeniia

來源

2013-04-29 Zheden

確定您使用的瀏覽器支持WebGL？我只是試着把你的代碼放到http://jsfiddle.net並且它正常工作。 – 2013-04-29 13:45:17

好點。嘗試THREE.CanvasRenderer（）。 – WestLangley 2013-04-29 13:50:00

做到這一點，而不是：

geom.vertices.push(v1); 
geom.vertices.push(v2); 
geom.vertices.push(v3);

您複製從網上過時的代碼 - 或者過時的書嗎？學習適用於當前版本庫的three.js示例。

three.js r.58

來源

2013-04-29 13:47:28 WestLangley

非常感謝！有效。 – Zheden 2013-04-29 13:51:59

three.js所繪製簡單的三角形

回答

相關問題