在A帧中添加多边形 [英] Add polygon in A-frame

问题描述

是否可以在A帧中添加多边形？就像这样：

Is there a way to add polygon in A-frame? Kinda like:

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

？

谢谢。

推荐答案

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

There used to be a polygon-component, but it doesn't work with 0.5.0 or 0.6.0. So you have to make your own in three.js, by creating a component which adds a mesh to your entity:

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 );

工作小提琴此处，它是'foo'组件。

Working fiddle here, it's the 'foo' component.

UPDATE

您可以使用以下方法沿z轴将其拉伸为3D对象：

UPDATE
You can make the shape to a 3D object by extruding it along the z-axis, using:

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

您可以找到有关拉伸参数的更多信息此处。 金额是对象的厚度。

工作小提琴此处。

You can find more information about extrusion params here. The amount is the 'thickness' of the object.
Working fiddle here.

这篇关于在A帧中添加多边形的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！