Nano Hash - криптовалюты, майнинг, программирование

Как загрузить или воспроизвести воспроизведение видео при обнаружении маркера (HIRO)

Я использую A-Frame. Я пытаюсь увеличить видео (mp4), когда шаблон или маркер (HIRO) зависает перед моей веб-камерой, видео должно быть загружено или воспроизведено на маркере. Теперь проблема с этим кодом заключается в том, что когда страница загружается, видео воспроизводится автоматически без каких-либо маркеров или шаблонов (HIRO). Видео отображается на маркере.

Я просто хочу загружать видео всякий раз, когда отображается узор или маркер. Без скороговорки он не должен загружаться. Пожалуйста, помогите мне с этим. Например: Воспроизведение видео в AR https://www.youtube.com/watch?v=jkcvfygpKiM&vl=en Видео Увеличение маркера

введите здесь описание изображения

<meta name="apple-mobile-web-app-capable" content="yes">
<!-- <script src="vendor/aframe/build/aframe.min.js"></script> -->
<script src="https://aframe.io/releases/0.8.0/aframe.min.js"></script>
<!-- <script src="vendor/aframe/build/aframe.js"></script> -->
<!-- include for artoolkit trackingBackend -->
<script src='aframe_lib/artoolkit.min.js'></script>
<script src='aframe_lib/artoolkit.api.js'></script>
<!-- include for aruco trackingBackend -->
<script src='aframe_lib/svd.js'></script>
<script src='aframe_lib/posit1.js'></script>
<script src='aframe_lib/cv.js'></script>
<script src='aframe_lib/aruco.js'></script>
<script src='aframe_lib/threex-arucocontext.js'></script>
<script src='aframe_lib/threex-arucodebug.js'></script>
<!-- include for tango trackingBackend -->
<script src='aframe_lib/THREE.WebAR.js'></script>
<!-- include ar.js -->
<script src='aframe_lib/signals.min.js'></script>
<script src='aframe_lib/threex-artoolkitprofile.js'></script>
<script src='aframe_lib/threex-artoolkitsource.js'></script>
<script src='aframe_lib/threex-artoolkitcontext.js'></script>
<script src='aframe_lib/threex-arbasecontrols.js'></script>
<script src='aframe_lib/threex-armarkercontrols.js'></script>
<script src='aframe_lib/threex-arsmoothedcontrols.js'></script>
<script src='aframe_lib/threex-hittesting-plane.js'></script>
<script src='aframe_lib/threex-hittesting-tango.js'></script>
<script src='aframe_lib/threex-armarkerhelper.js'></script>
<script src='aframe_lib/arjs-utils.js'></script>
<script src='aframe_lib/arjs-session.js'></script>
<script src='aframe_lib/arjs-anchor.js'></script>
<script src='aframe_lib/arjs-hittesting.js'></script>
<script src='aframe_lib/arjs-tangovideomesh.js'></script>
<script src='aframe_lib/arjs-tangopointcloud.js'></script>
<script src='aframe_lib/arjs-debugui.js'></script>
<script src='aframe_lib/threex-armultimarkerutils.js'></script>
<script src='aframe_lib/threex-armultimarkercontrols.js'></script>
<script src='aframe_lib/threex-armultimarkerlearning.js'></script>
<!-- include aframe-ar.js -->
<script src="aframe_lib/system-arjs.js"></script>
<script src="aframe_lib/component-anchor.js"></script>
<script src="aframe_lib/component-hit-testing.js"></script>
<!-- start the body of your page -->

<body style='margin : 0px; overflow: hidden;'>
  <a-scene embedded arjs='trackingMethod: best;'>
    <a-anchor hit-testing-enabled='true'>
      <a-entity>
        <video type="video/mp4" id="penguin-sledding" autoplay="true" loop="false" src="resources/video.mp4" webkit-playsinline>
         </a-entity>
         <a-video  position="0 0.2 0" src="#penguin-sledding" rotation="90 180 0"></a-video>
      </a-anchor>
      <a-camera-static preset='hiro'/>
      <a-entity light="color: #ccccff; intensity: 1; type: ambient;" visible="">
      </a-entity>
   </a-scene>
</body>



Ответы:


1

Он воспроизводится при загрузке из-за атрибута autoplay. Также вы должны добавить video в активы.


Чтобы воспроизвести видео, когда маркер виден, убедитесь, что у вас есть видео внутри узла <a-marker>, например здесь.

<a-marker>
    <a-video vidhandler></a-video>
</a-marker>

Когда вы видите маркер - воспроизводите видео.
Когда вы теряете маркер, ставьте видео на паузу.

AFRAME.registerComponent('vidhandler', {
  init: function () {
    this.toggle = false;
    document.querySelector("#vid").pause(); //reference to the video
  },
  tick:function(){  
   if(document.querySelector("a-marker").object3D.visible == true){
     if(!this.toggle){
       this.toggle = true;
       document.querySelector("#vid").play();
     }
   }else{
     this.toggle = false;
     document.querySelector("#vid").pause();
   }
  }
});
18.07.2018
  • Я интегрировал ваш код в свой код, но он все равно не работает. Код находится по следующей ссылке, пожалуйста, просмотрите его и помогите мне - jsfiddle.net/anil001ry/ grh7ut3L / 8 ............. Заранее спасибо 19.07.2018
  • Это хорошо работает на Android, но я не могу заставить его работать в Safari на iOS? любая помощь будет оценена. 08.01.2020
  • Вероятно, вам потребуется какое-либо взаимодействие с пользователем (щелчок), чтобы видео воспроизводилось на iOS. Убедитесь, что видео работает без ar.js (vanilla aframe). 08.01.2020
  • Новые материалы

    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..

    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..

    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..

    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..

    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..

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

    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..