1

有没有一种简单的方法来找出在 gltf 模型中单击的子网格的名称？我在 0.8.0 的框架上。

我尝试了以下 -

HTML 源代码：

  <a-scene embedded="" raycaster-autorefresh cursor="rayOrigin: mouse">
                <a-assets>
                    <a-asset-item id="male" src="../images/trying/scene.gltf"> 
                    </a-asset-item>         
                </a-assets>

 <a-entity id="camera" camera="" position="0 1.6 0" look-controls wasd-controls>
 </a-entity> 

 <a-entity gltf-model="#male" position="-14 -30 -125" rotation= "0 160 0" material-displacements></a-entity> 

</a-scene>

组件来源：

    // first component
AFRAME.registerComponent('raycaster-autorefresh', {
  init: function () {
    var el = this.el;
    this.el.addEventListener('object3dset', function () {
      var cursorEl = el.querySelector('[raycaster]');
      cursorEl.components.raycaster.refreshObjects();
    });
  }
});


// second component
var lastIndex = -1;
    var colors = ['red', 'green', 'blue', 'black'];
         AFRAME.registerComponent('material-displacements', {
         init: function () {   
            this.el.addEventListener('object3dset', () => { 
              this.el.addEventListener('click', (evt) => {
              console.log(evt.detail.intersection.object.name);
              });
            });   
          },
    update: function () {
        lastIndex = (lastIndex + 1) % colors.length;
        console.log(lastIndex);
        this.material  = new THREE.MeshStandardMaterial({color: colors[lastIndex]});

        const mesh = this.el.getObject3D('mesh');
        console.log("mesh is", mesh);
        console.log("material is", this.material);

        if (mesh) {
          mesh.traverse((node) => {

            if (node.name==="bed_Wood_0") {
            if (node.isMesh) node.material = this.material;

          }
          });
        }

      }
    });

但是，它只提供第一个子网格的名称。同样，evt.detail.intersection.point 只提供相同的 x、y 和 z 坐标，而与我在模型上单击的位置无关。

我的要求是能够确定在 gltf 模型中单击了哪个子网格

4

1 回答 1

1

同样，evt.detail.intersection.point 只提供相同的 x、y 和 z 坐标，而与我在模型上单击的位置无关。

这是一个错误 - 每个问题 #3467更新到 A-Frame 0.8.2 。raycaster-autorefresh在 A-Frame 0.8+ 中也应该不需要。

对于从附加到单击的节点的节点获取名称的剩余问题，请考虑以下代码：

this.el.addEventListener('click', (evt) => {
  var object = evt.detail.intersection.object;

  // name of entity to which component is attached
  console.log(this.el.getObject3D('mesh').name);

  // name of object directly clicked
  console.log(object.name);

  // name of object's parent
  console.log(object.parent.name);

  // name of object and its children
  object.traverse((node) => console.log(node.name));
});

以上所有将给出被点击的网格周围节点的名称。如果没有演示，我无法猜测您希望点击其中的哪些，或者存在哪些节点，所以我认为您需要从那里进行试验。另请参阅THREE.Object3D 的文档。

于 2018-04-24T14:15:25.040 回答