Я пытаюсь сделать проект на ar.js - PullRequest
Новая
       70

Я пытаюсь сделать проект на ar.js

0 голосов
/ 11 марта 2019

Я нашел код на глюк, который воспроизводит видео при сканировании маркера, но проблема в том, что он работает только на рабочем столе, на хром-андроиде видео не появляется, слышен только звук ... пожалуйста, помогите мне, так какЯ не знаю много кодирования.Вот исходный код: 

<html>

<head>
  <!-- AR.js by @jerome_etienne - github: https://github.com/jeromeetienne/ar.js - info: https://medium.com/arjs/augmented-reality-in-10-lines-of-html-4e193ea9fdbf -->
  <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script>
<script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.5.0/aframe/build/aframe-ar.js"></script>
  <script src="//cdn.rawgit.com/donmccurdy/aframe-extras/v3.8.4/dist/aframe-extras.min.js"></script>

  <script src="https://rawgit.com/mayognaise/aframe-gif-shader/master/dist/aframe-gif-shader.min.js"></script>
  <script>
AFRAME.registerComponent('vidhandler', {
  // ...
  init: function () {
    // Set up initial state and variables.
    this.toggle = false;
    this.vid = document.querySelector("#vid")
    this.vid.pause();
  },
  tick:function(){
    
if(this.el.object3D.visible == true){
  if(!this.toggle){
     this.toggle = true;
     this.vid.play();
    }
  }else{
  this.toggle = false;
    this.vid.pause();
    }
  }
});
  </script>
  <body style='margin : 0px; overflow: hidden;'>
  <div style='position: fixed; top: 10px; width:inherit; text-align: center; z-index: 1;'>
    <a href="https://github.com/jeromeetienne/AR.js/" target="_blank">AR.js</a> - Check out the repository !
  </div>
  <a-scene embedded artoolkit='sourceType: webcam; detectionMode: mono; maxDetectionRate: 30; canvasWidth: 240; canvasHeight: 180' >
    <a-assets>
      <video id="vid" src="https://cdn.glitch.com/b62367d1-ceab-454b-b664-b032f995ed86%2FBig_Buck_Bunny_Trailer_1080p.ogv.720p.webm?1532370072191" loop="true" crossorigin>
    </a-assets>
   
    <a-marker id="memarker" preset="hiro" vidhandler>
      <a-plane position='1 2 -2' scale="2 2 2" width="2" rotation="-90 0 0" material='transparent:true;opacity: 0.7;src:#vid'></a-plane>
    </a-marker>

  </a-scene>
</body>


</html>

если бы кто-то мог сказать мне, что делать, это было бы очень полезно

1 Ответ

1 голос
/ 11 марта 2019

Проблема здесь в положении видео - оно показывается, но далеко.Если вы измените плоскость на <a-box> и установите ее положение на 0 0 0, то и на Chrome, и на Firefox для Android показывается видео.

Проверьте это здесь .

Один совет: если какой-то странный переполнение стека anwser код не работает должным образом - попробуйте просто набрать как можно больше: - выброситьненужное включает (например, aframe-extras) - максимально упростите сцену.Любые дополнительные геометрии, компоненты - просто чтобы сделать это простым.

Если это не поможет, то наверняка это облегчит отладку.

...