获取网格的顶点的最佳方法 Three.js [英] Best way to get vertices of a mesh three.js

问题描述

我是 Three.js 的新手，所以也许我不会以最佳方式接近这个，

I am new to Three.js so perhaps I am not going abut this optimally,

我有如下创建的几何体，

I have geometry which I create as follows,

const geo = new THREE.PlaneBufferGeometry(10,0);

然后我对其应用旋转

geo.applyMatrix( new THREE.Matrix4().makeRotationX( Math.PI * 0.5 ) );

然后我用它创建一个网格

then I create a Mesh from it

const open = new THREE.Mesh( geo, materialNormal);

然后我对网格应用一系列操作以正确定位它，如下所示:

I then apply a bunch of operations to the mesh to position it correctly, as follows:

open.position.copy(v2(10,20);
open.position.z = 0.5*10

open.position.x -= 20
open.position.y -= 10
open.rotation.z = angle;

现在在位置改变之前和之后获取网格顶点的最佳方法是什么?我很惊讶地发现网格的顶点没有内置到three.js 中.

Now what is the best way to get the vertices of the mesh both before and after it's position is changed? I was surpised to discover that the vertices of a mesh are not in-built into three.js.

任何提示和代码示例将不胜感激.

Any hints and code samples would be greatly appreciated.

推荐答案

我认为您被有关 Three.js 对象的某些语义所迷惑.

I think you're getting tripped-up by some semantics regarding three.js objects.

1) Mesh 没有顶点.Mesh 包含对 Geometry/BufferGeometry 和 Material(s) 的引用.顶点包含在 Mesh 的 geometry 属性/对象中.

1) A Mesh does not have vertices. A Mesh contains references to Geometry/BufferGeometry, and Material(s). The vertices are contained in the Mesh's geometry property/object.

2) 您正在使用 PlaneBufferGeometry，这意味着 BufferGeometry 对象的实现.BufferGeometry 将其顶点保留在 position 属性 (mesh.geometry.attributes.position) 中.请记住，顶点顺序可能会受到 index 属性(mesh.geometry.index)的影响.

2) You're using PlaneBufferGeometry, which means an implementation of a BufferGeometry object. BufferGeometry keeps its vertices in the position attribute (mesh.geometry.attributes.position). Keep in mind that the vertex order may be affected by the index property (mesh.geometry.index).

现在对于您的问题，几何原点也是其父 Mesh 的原点，因此您的网格变换前"顶点位置与创建网格时完全相同.只需按原样读出它们即可.

Now to your question, the geometric origin is also its parent Mesh's origin, so your "before mesh transformation" vertex positions are exactly the same as when you created the mesh. Just read them out as-is.

要获得网格变换后"顶点位置，您需要获取每个顶点，并将其从 Mesh 的局部空间转换为世界空间.幸运的是，three.js 有一个方便的功能可以做到这一点:

To get the "after mesh transformation" vertex positions, you'll need to take each vertex, and convert it from the Mesh's local space, into world space. Luckily, three.js has a convenient function to do this:

var tempVertex = new THREE.Vector3();
// set tempVertex based on information from mesh.geometry.attributes.position

mesh.localToWorld(tempVertex);
// tempVertex is converted from local coordinates into world coordinates,
// which is its "after mesh transformation" position

这篇关于获取网格的顶点的最佳方法 Three.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！