我在使用Three.js创建简单的2D场景时遇到问题.我想在彩色三角形上创建2D视图.我无法将三角形设为彩色(例如红色).我相信我将需要以下内容:
>三.正交相机
>简单三角形->即以红色显示的THREE.Geometry()
我不想有任何阴影,只是正交场景中的一个简单的红色2D三角形,欢迎提出任何建议.
解决方法:
如果要使用基本Geometry类,则需要将所有自己的顶点添加到场景中.您可以像这样使用Vertex类来执行此操作
var geometry = new THREE.Geometry();
var v1 = new THREE.Vector3(0,0,0); // Vector3 used to specify position
var v2 = new THREE.Vector3(1,0,0);
var v3 = new THREE.Vector3(0,1,0); // 2d = all vertices in the same plane.. z = 0
// add new geometry based on the specified positions
geometry.vertices.push(v1);
geometry.vertices.push(v2);
geometry.vertices.push(v3);
然后,我们需要根据我们的顶点构造一个面,您按照将顶点的索引推入上方的顺序传递它们.
[编辑]:正如mrdoob指出的那样,您还需要按逆时针顺序添加它们.
这是我的小提琴的问题.您可以查看fixed demo here.
geometry.faces.push(new THREE.Face3(0, 2, 1));
最后创建一种材质,并将其与您的几何体结合起来以创建网格.即使对于2D,我相信您也需要创建一个网格才能显示它.
var redMat = new THREE.MeshBasicMaterial({color: 0xff0000});
var triangle = new THREE.Mesh(geometry, redMat);
scene.add(triangle) // added at the origin