在AR.js中播放有关标记检测的视频

时间:2019-03-09 16:01:12

标签: javascript ar.js

AFRAME.registerComponent('vidhandler', {
    init: function () {
      var marker = this.el
      var videoEl = document.querySelector("#video");
      
      marker.addEventListener('markerFound', function() {
        var markerId = marker.id;
        console.log('markerFound', markerId);
        videoEl.play();
      });
      marker.addEventListener('markerLost', function() {
        var markerId = marker.id;
        console.log('markerLost', markerId);
        videoEl.pause();
      });
    }
  });
<a-scene embedded arjs='trackingMethod: best; patternRatio: 0.8; debugUIEnabled: false;' hidden>
    <a-assets>
      <a-assets-item id="video" src="assets/video/orangebw.mp4"></a-assets-item>
    </a-assets>
        <a-marker emitevents="true" id="marker" type="pattern" url="assets/markers/tagmarker.patt" vidhandler>
           <a-plane id="vid" src="#video" rotation="-90 0 0" width="1.6" height="0.8"></a-plane> 
        </a-marker>
        <a-entity camera></a-entity> 
  </a-scene>
强文本

在加载页面之前,在检测到标记之前,视频中的声音就会开始播放。视频确实会在检测到标记时显示,但即​​使丢失了标记,视频的声音仍会继续播放。我希望视频在检测到标记时播放,在丢失标记时暂停。

0 个答案:

没有答案