如何从A-Frame组件访问bufferGeometry的属性

Question

我正在编写一个组件，需要访问和修改作为资产读入A-Frame的模型上的位置，法线和uv属性。我可以接近访问数据，但不能完全达到目的。使用：

document.querySelector('a-entity').object3D.children

似乎给了我一个数组，但是试图访问这些元素会给我一个空子和空几何的对象。

我的猜测是，我正试图通过错误的门访问数据，同时：

console.log(document.querySelector('a-entity').object3D.children);

显示数组大小= 1，带有填充的Object元素

console.log(document.querySelector('a-entity').object3D.children[0]);

给我带有空地理位置的元素等。用于获取数据的正确机制或语法是什么？

Answer 1

您需要了解两个三个.js课程：Geometry和BufferGeometry。前者已具有geometry.vertices和geometry.faces的属性（请参阅其中的文档）。顶点是THREE.Vertex3对象的数组，易于使用。

如果您有一个BufferGeometry，那么您的geometry.attributes.position 不是THREE.Vertex3的数组，而是包含一个平面的浮点数组，如[x1, y1, z1, x2, y2, ...] 。这样效率更高，但手动修改更难。

如果你有BufferGeometry但宁愿使用Geometry，那么你可以转换为任何一种方式：

var geometry = Geometry.fromBufferGeometry( mesh.geometry );
mesh.geometry =  BufferGeometry.fromGeometry( geometry );

A-Frame特定注释，通常您可以通过el.getObject3D('mesh')获得对网格的引用。对于可能是嵌套组的自定义模型，在这种情况下：

el.object3D.traverse(function(node) {
  if (node.geometry) { /* ... */ }
});

（three.js r84）