Question

我已经从如下框架中添加了对基本几何体的点击处理程序：

<a-scene>
  <a-sphere id="ball" cursor-listener material="color: red" position="-3 3 -5" onclick="showplane('#box1')" >
  </a-sphere>
</a-scene>

我想在单击球形时对平面几何进行动画处理，并且当用户看到平面时，我需要为平面附加一个单击处理程序。

JS小提琴：https://jsfiddle.net/bhupi1011/9ptLqa32/

单击处理程序，不能同时使用两种几何。

谢谢。

Answer 1

您必须在场景中添加cursor。对于鼠标单击，您可以执行以下操作：

<a-scene cursor="rayOrigin: mouse">

使用组件来处理点击事件：

AFRAME.registerComponent('select', {
  init: function () {
    var originalColor = this.el.getAttribute('material').color;
    var self = this;
    this.el.sceneEl.addEventListener('click', function (evt) {
      var color;
      if (evt.detail.intersectedEl === undefined) { return; }
      var color = evt.detail.intersectedEl === self.el ? 'green' : originalColor;
      self.el.setAttribute('color', color);
    }, false);
  }
});

演示：https://jungle-plate.glitch.me/

代码：https://glitch.com/edit/#!/jungle-plate?path=select.js:12:3

点击处理程序不适用于基本的几何对象

1 个答案: