hiukim / mind-ar-js

Web Augmented Reality. Image Tracking, Face Tracking. Tensorflow.js
MIT License
2.21k stars 413 forks source link

Multiple video as one entity #166

Closed fourthedesign closed 1 year ago

fourthedesign commented 2 years ago

I try to load multiple videos on the screen on different planes that respond to one mark as in the Overview example of the MindAR documentation. I tried different combinations using just a-entity or a-plane, however only the 1st of the 2 videos loads. I add some examples of the a-scene settings that I tried.

<a-scene mindar-image="filterMinCF:0.01; filterBeta: 70; warmupTolerance: 1; uiLoading: #loading; uiScanning: #loading;imageTargetSrc: ./targets(1).mind" vr-mode-ui="enabled: false" device-orientation-permission-ui="enabled: false"> 
    <a-assets>
       <video id="myvideo" src="https://stasishellas22.gr/WebAR/merged-video.webm" type="video/webm" loop="true" playsinline autoplay></video>
       <video id="myvideo1" src="https://stasishellas22.gr/WebAR/fish_sequence_V8_VORBIS.webm" type="video/webm" loop="true" playsinline autoplay></video>
    </a-assets>
    <a-camera position="0 0 0" vr-mode-ui="enabled: false" look-controls="enabled: false"></a-camera>
    <a-entity id="objectAR" mindar-image-target="targetIndex: 0" look-controls="enabled: false">
        <a-entity look-controls="enabled: false" material="shader: transparent-video; src: #myvideo" geometry="primitive: plane; width: 1.035; height: 1.5" position="0 0 0">
        </a-entity>
        <a-entity look-controls="enabled: false" material="shader: transparent-video; src: #myvideo1"
            geometry="primitive: plane; width: 1.5; height: 1.9" position="0.5 0 0.5">
        </a-entity>
    </a-entity>
 </a-scene>
 <a-scene mindar-image="filterMinCF:0.01; filterBeta: 70; warmupTolerance: 1; uiLoading: #loading; uiScanning: #loading;imageTargetSrc: ./targets(1).mind" vr-mode-ui="enabled: false" device-orientation-permission-ui="enabled: false"> 
    <a-assets>
       <video id="myvideo" src="merged-video.webm" type="video/webm" loop="true" playsinline autoplay></video>
       <video id="myvideo1" src="fish_sequence_V8_VORBIS.webm" type="video/webm" loop="true" playsinline autoplay></video>
    </a-assets>
    <a-camera position="0 0 0" vr-mode-ui="enabled: false" look-controls="enabled: false"></a-camera>
    <a-entity id="objectAR" mindar-image-target="targetIndex: 0" look-controls="enabled: false">
        <a-plane src="#myvideo" position="0 0 0" height="0.552" width="1" rotation="0 0 0"></a-plane>
        <a-plane src="#myvideo1" position="0 0 0" height="0.552" width="1" rotation="0.5 0 0.5"></a-plane>
    </a-entity>
 </a-scene>
JamesBotterill commented 2 years ago

I've found this is a device limitation on iOS at least.

hiukim commented 1 year ago

stale. feel free to re-open if there is new insight.