Question

我需要知道如何获取相机光标的位置并在该位置添加实体，然后检查许多解决方案，例如 how can i add entity on cursor position using aFrame 这是我的代码示例`

  <a-text font="kelsonsans" value="Puy de Sancy, France" width="6" position="2 11 0"
          rotation="0 15 0"></a-text>

          <a-camera camera-logger id="camera"> <a-cursor fuse="true" color="yellow"></a-cursor> </a-camera>
</a-scene>`

这是我的JS代码

  function getPos(){
     var cameraEl = document.querySelector('#camera');
     var WorldPosition = cameraEl.object3D.getWorldPosition();
     var pos = cameraEl.getAttribute('position');
     var rot = cameraEl.getAttribute('rotation');
     console.log(WorldPosition);
     console.log(pos);
     console.log(rot);
  }

但是当我尝试按以下所示设置实体位置时，该位置未显示，因为它的位置坐标为“ x：-5.385803274229736，y：69.90085100596048，z：0”
但是，不同的位置坐标可能会有所不同。可能是ThreeJs位置，请为我提供完整的解决方案

Answer 1

截至2020年7月AFRAME 1.0.4：

Kevin显然知道他在这个话题上很烂，但是他的回答对我也不起作用；我认为这是因为自1.0.0版以来的变化。

唯一的错误是cursor.components.intersectedEl似乎不再是问题。尽管如此，至少就我而言，这很容易解决，因为我知道我想要从其交叉的对象，因此可以侦听mouseenter和mouseleave事件。

不会解决所有情况，但要解决下一个问题：

var cursor = document.querySelector('[cursor]');
var elToWatch = document.querySelector('[gameboard]')
var intersection = cursor.components.raycaster.getIntersection(elToWatch);
var intersectionPosition = intersection.point;

Answer 2

以下是从光标获取交集数据的方法。

var cursor = document.querySelector('a-cursor'); 
if (!cursor.components.intersectedEl) { return; }
var intersection = cursor.components.raycaster.getIntersection(cursor.components.intersectedEl);
var intersectionPosition = intersection.point;

我认为在master中，光标事件详细信息包含对getIntersection的引用，因此您可以像evt.detail.getIntersection(evt.detail.intersectedEl)那样调用。

aframe获取光标位置并在该位置上设置实体

2 个答案:

截至2020年7月AFRAME 1.0.4：