如何在three.js r68中制作矩形金字塔？

Question

我在r68上，我正在尝试找一个创建矩形金字塔的例子，我可以应用THREE.MeshFaceMaterial（），大多数示例看起来已经过时并且在我当前的构建中抛出错误。

我只需要能够

• 纹理每个面孔
• 旋转它使矩形面位于-y位置

提前致谢！

Answer 1

接受的答案仅适用于具有相等边的基座的金字塔。 如果你想要一个长方形的金字塔，你可以这样做：

var geometry = new THREE.Geometry();

geometry.vertices = [
    new THREE.Vector3( 0, 0, 0 ),
    new THREE.Vector3( 0, 1, 0 ),
    new THREE.Vector3( 1, 1, 0 ),
    new THREE.Vector3( 1, 0, 0 ),
    new THREE.Vector3( 0.5, 0.5, 1 )
];

geometry.faces = [
    new THREE.Face3( 0, 1, 2 ),
    new THREE.Face3( 0, 2, 3 ),
    new THREE.Face3( 1, 0, 4 ),
    new THREE.Face3( 2, 1, 4 ),
    new THREE.Face3( 3, 2, 4 ),
    new THREE.Face3( 0, 3, 4 )
];    

现在，您有一个金字塔几何图形，其方形底边为1 x 1 ，高度为1 。 通过应用缩放矩阵，我们可以将此金字塔设置为任何所需的width / length / height组合：

var transformation = new THREE.Matrix4().makeScale( width, length, height );

geometry.applyMatrix( transformation );

这也可以包装在自定义Pyramid几何类中，以便您可以像这样使用它：

new THREE.Pyramid( width, length, height );

Answer 2

正如@WestLangley所说，使用THREE.CylinderGeometry()来做到这一点是正确的方法，这就是我的做法

var geometry = new THREE.CylinderGeometry( 1, TILE_SIZE*3, TILE_SIZE*3, 4 );
var material = new THREE.MeshBasicMaterial( {color: 0xffff00 , wireframe:true} );
var cylinder = new THREE.Mesh( geometry, material );
this.scene.add( cylinder );

作品完美！

Answer 3

使用ConeBufferGeometry几何体并将radialSegments更改为4

BufferGeometry比普通几何更快

您可以调整的其他参数：

ConeBufferGeometry(radius : Float, height : Float, radialSegments : Integer, heightSegments : Integer, openEnded : Boolean, thetaStart : Float, thetaLength : Float)

结果：

现场演示：

https://threejs.org/docs/#api/en/geometries/ConeBufferGeometry