在 A 帧中添加多边形

Question

有没有办法在A-frame中添加多边形？有点像：

<a-entity geometry="primitive:polygon;positions:x y z, ..., x y z;">
</a-entity>

?

谢谢。

Answer 1

曾经有一个多边形组件，但它不适用于 0.5.0 或 0.6.0。因此，您必须在 three.js 中创建自己的组件，方法是创建一个向您的实体添加网格的组件：

let points = []; //vertices of Your shape
points.push( new THREE.Vector2( 0, 0 ) );
points.push( new THREE.Vector2( 3, 0 ) );
points.push( new THREE.Vector2( 5, 2 ) );
points.push( new THREE.Vector2( 5, 5 ) );
points.push( new THREE.Vector2( 5, 5 ) );
points.push( new THREE.Vector2( 2, 7 ) );
// scaling, not necessary:
for( var i = 0; i < points.length; i ++ ) {
    points[ i ].multiplyScalar( 0.25 );
}
// Create new shape out of the points:
var heartShape = new THREE.Shape(points);
// Create geometry out of the shape
var geometry = new THREE.ShapeGeometry( heartShape );
// Give it a basic material
var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
// Create a mesh using our geometry and material
var mesh = new THREE.Mesh( geometry, material ) ;
// add it to the entity:
this.el.object3D.add( mesh );

工作 fiddle here，它是 'foo' 组件。

更新
您可以通过沿 z 轴拉伸它来制作 3D 对象的形状，使用：

var extrudedGeometry = new THREE.ExtrudeGeometry(shape, {amount: 5, 
bevelEnabled: false});

您可以找到有关挤压参数的更多信息 here。 amount是对象的'thickness'。
工作 fiddle here.

在 A 帧中添加多边形

Add polygon in A-frame

aframe