Question

我需要使用controller-cursor-component来显示两个点（不是两个对象）的距离，但是我只能找到一种方法来显示相交对象和相机之间的距离。

有什么好办法解决吗？抱歉，我是Aframe的新手，任何建议将不胜感激！

<html>

<head>
<meta name='viewport' content='width=device-width, user-scalable=no,minimum-scale=1.0, maximum-scale=1.0'>
<meta charset="utf-8">
<title>Hello, WebVR</title>

<script src="test/aframe-master.min.js"></script>
<script src="js/jquery-3.2.1.min.js"></script>   
<script src="lib/aframe/aframe-controller-cursor-component.js"></script>

<script AFRAME.registerComponent('cursor-listener', {
  init: function () {

  this.el.addEventListener('click', function (evt) {
  console.log(evt.detail.intersection.distance);

    });
  }
});
</script>

</head>

<body>
<a-scene id="scene"  stats>

<a-entity id="cameraRig"  position="0 28 6">
  <a-entity id="head" camera  look-controls orbit-controls  wasd-controls></a-entity>
 <a-entity id="righthand" vive-controls="hand: right" controller-cursor ></a-entity>
 </a-entity>

<a-entity cursor-listener id="Element_1090" class="FireOne1" gltf-model="url(model1205/1-Fire_one/Element_1090.glb)"
  gps-place="lon:121.434540342353; lat:25.2012249857784; height:33.133450"></a-entity>

  </a-scene>

</body>

</html>

Answer 1

我不能完全确定激光点的含义，但是我将假定它是正确的实体。但实际上，要计算两个对象之间的距离，可以使用Vector3 .distanceTo函数。有关功能，请参见此处的文档：Vector3.distanceTo

基本上，我会做这样的事情：（我还没有测试代码，只是为了向您展示方向）

let rh = document.querySelector('#righthand');
this.el.addEventListener('click', function (evt) {
  let distance = evt.currentTarget.object3D.position.distanceTo(rh.object3D.position);
});

#Aframe我能获得激光点的位置而不是物体的位置吗？

1 个答案: