在标记检测 A-frame 和 Ar.js 上播放一次音频答案

【问题标题】：Play audio ONCE on marker detection A-frame & Ar.js在标记检测 A-frame 和 Ar.js 上播放一次音频
【发布时间】：2021-08-29 20:08:11
【问题描述】：

当使用 A-frame 和 AR.JS 库检测到标记时，我尝试只播放一次声音。

我正在尝试下面的代码行，但声音播放不定。

<a-scene embedded arjs='sourceType: webcam; debugUIEnabled: false;';>
     <a-assets>
         <audio id="sound" src="audio.mp3" preload="auto"></audio>
     </a-assets>
     <a-marker preset="hiro">
                <a-entity id="examplemodel" gltf-model="./models/Example.glb" soundhandler></a-entity>
     </a-marker>
     <a-entity sound="src: #sound" autoplay="false"></a-entity>
     <a-entity camera></a-entity>
</a-scene>

<script>
AFRAME.registerComponent('soundhandler', {
    tick: function () {
         var entity = document.querySelector('[sound]');
         if (document.querySelector('a-marker').object3D.visible == true) {
             entity.components.sound.playSound();
         } else {
             entity.components.sound.pauseSound();
         }
    }
});
</script>

当我为 init 更改刻度时，我收到了这个错误：

未捕获的类型错误：无法读取未定义的属性“playSound”

你能给我一些解决这个问题的想法吗？

【问题讨论】：

标签： javascript audio three.js aframe ar.js

【解决方案1】：

它会无限播放，因为一旦它可见 - 在每个渲染循环上你调用playSound()。

如果您添加一个简单的切换检查 - 您将获得“一次可见”结果：

tick: function() {
  // marker is the object3D of marker
  if (marker.visible && !this.markervisible) {
    // do your stuff here once per visible
    this.markervisible = true;
  } else if (!marker.visible) {
    this.markervisible = false;
  }
}

看看here

【讨论】：

非常感谢！这正是我所需要的。