Question

我使用aframe和ar.js扫描照片并播放视频。扫描照片后，我在一页中有2张照片，有2个视频供播放。现在，当我扫描照片时，显示矩形时会显示视频。

扫描=> photo1.jpg ===和paly ===> video1.mp4
扫描=> photo2.jpg ===和paly ===> video2.mp4

这是我的代码：

<script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@1c2407b26c61958baa93967b5412487cd94b290b/dist/aframe-master.min.js"></script>

<script src='https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar-nft.js'></script>

<body style='margin : 0px; overflow: hidden;'>
    <div class="arjs-loader">
        <div>plase wiate ... </div>
    </div>
    <a-scene
        vr-mode-ui="enabled: false;"
        renderer='antialias: true; alpha: true; precision: mediump;'
        embedded arjs='trackingMethod: best; sourceType: webcam; debugUIEnabled: false;'>
            <a-nft
                videohandler
                type='nft' 
                url='https://ala.org.ir/ar/photo1'
                smooth="true" smoothCount="10" smoothTolerance="0.01" smoothThreshold="5">
            <a-assets>
                <video src="https://ala.org.ir/ar/video1.mp4"
                    preload="auto" id="vid" response-type="arraybuffer" loop
                    crossorigin webkit-playsinline autoplay  playsinline>
                </video>
            </a-assets>
                <a-video
                    src="#vid"
                    position='0 0 0'
                    rotation="-90 0 0"
                    width='300'
                    height='175'
                    >
                </a-video>
            </a-nft>
            
            <a-nft
                videohandler
                type='nft' 
                url='https://ala.org.ir/ar/photo2'
                smooth="true" smoothCount="10" smoothTolerance="0.01" smoothThreshold="5"
            >
            <a-assets>
                <video src="https://ala.org.ir/ar/video2.mp4"
                preload="auto" id="vie" response-type="arraybuffer" loop
                crossorigin webkit-playsinline autoplay  playsinline>
            </video>
            </a-assets>
                <a-video
                    src="#vie"
                    position='0 0 0'
                    rotation="-90 0 0"
                    width='300'
                    height='175'
                    >
                </a-video>
            </a-nft>

            <a-entity camera ></a-entity>
    </a-scene>
</body>

在Afram ar中播放视频nft

0 个答案: