A-Frame触发器javascript功能与相机发生冲突

Question

每当相机碰撞或碰到一个物体时，我都会尝试触发我的乐谱功能：

<a-entity id="rock" static-body obj-model="obj:models/rock_mesh.obj;mtl:images/rock_mesh.mtl" rotation="0 90 0" position="7.30242379045994 0.3 0">
     </a-entity>

我在相机上装了一个得分文字：

 <a-text id="score" value="0" position="-0.2 -0.5 -1" color="red" width="5" anchor="left"></a-text>

并试图触发这样的功能：

let score = 0;
score = score + 1
$("#score").setAttribute('text','value','Score '+score)

这只是一个草拟代码，我还是javascript的新手

我怎样才能做到这一点？ 每当我的相机接触到这个“摇滚”物体时，屏幕上的分数会增加？

如何检测碰撞或触摸物体和相机？

提前致谢。

Answer 1

检测碰撞的最简单方法是检测三个边界框是否重叠

您可以使用Ngo Kevins aabb-collider在碰撞时发出hitstart 。 但请记住，相机没有自己的几何体：

<a-camera foo geometry="primitive: box" aabb-collider="objects: a-box"></a-camera>
<a-box scale="2 2 2" class="box" color="blue" position="0 1.6 -5" ></a-box>

foo是hitstart的简单事件监听hitstart 。

AFRAME.registerComponent("foo", {
  init: function() {
     this.el.addEventListener("hitstart", (e)=>{
         // Collision ! increment the score
     })
  }
})

在这里小提琴

如果可能，我不会检测到与您的模型的碰撞，但会创建一些碰撞盒。

---

值得一提的是，如果您想在项目中使用物理引擎 ，Don McCurdys Physics System也可以进行碰撞检测 。 而不是hitstart ，你需要倾听collision 。

Answer 2

这样做：

score++;
$("#score").attr("value", score);