A 型框架，AR.JS。如何在 NFT-Marker 中定位对象？

Question

A 型框架，AR.JS。如何在 NFT-Marker 中定位对象？

alp*_*lix 7 javascript three.js aframe ar.js

我在将视频元素定位在 NFT 标记区域内时遇到问题。仔细研究了 AR.JS 和 AFRAME 文档，但没有成功。

问题：在具有不同屏幕分辨率和相机分辨率的每个设备上，视频的位置不同。如果我根据我的 PC 网络摄像头设置 sourceWidth、sourceHeight、displayWidth、displayHeight，我将无法再在智能手机上看到该对象，因为它会在屏幕外渲染。

第二个问题是使视频元素的大小与标记完全相同。在不同的设备和相机上，视频大小是不同的。

看截图

我的代码几乎与 ar.js 存储库中的 nft 示例类似。

<script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@c5eabc1ac708a76a0dbe9538c40ecd290af65714/dist/aframe-master.js"></script>
<script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar-nft.js"></script>

<script>
    window.onload = function() {
        AFRAME.registerComponent('videohandler', {
            init: function () {
                var marker = this.el;

                this.vid = document.querySelector("#vid");

                marker.addEventListener('markerFound', function () {
                    this.vid.play();
                }.bind(this));
    
        marker.addEventListener('markerLost', function() {
            this.vid.pause();
            this.vid.currentTime = 0;
        }.bind(this));
            }
        });
    };
</script>

<body style="margin: 0px; overflow: hidden">

    <a-scene vr-mode-ui="enabled: false;" renderer="logarithmicDepthBuffer: false; " embedded arjs="trackingMethod: best; sourceType: webcam; debugUIEnabled: false; sourceWidth:414; sourceHeight:736; displayWidth: 414; displayHeight: 736;">
      <a-assets>
        <video src="https://cors-anywhere.herokuapp.com/https://www.w3schools.com/html/mov_bbb.mp4" preload="auto" id="vid" response-type="arraybuffer" loop
          crossorigin webkit-playsinline autoplay muted playsinline preload="true"></video>
      </a-assets>

      <a-nft type="nft" videohandler url="https://arjs-cors-proxy.herokuapp.com/https://raw.githack.com/AR-js-org/AR.js/master/data/dataNFT/pinball" smooth="true" smoothCount="10" smoothTolerance="0.01" smoothThreshold="5" preload="true">
        <a-video src="#vid" position="0 0 0" width="300" height="424" rotation="-90 0 0" videoelement>
        </a-video>
      </a-nft>

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

Run Code Online (Sandbox Code Playgroud)

存储库中的实时示例： https: //ar-js-org.github.io/AR.js/aframe/examples/image-tracking/nft-video/ 扫描此图像： https: //raw.githubusercontent.com/AR -js-org/AR.js/master/aframe/examples/image-tracking/nft-video/pinball.jpg

例如，有没有办法获取标记大小和位置并设置视频元素的确切大小和位置？

任何帮助表示赞赏！

Answer 1

小智 0

我最近在使用 NFT 时遇到了这个问题，并发现 x、y、z 位置轴并没有真正调整（或不正常），除非您一次修改多个轴。

不确定它是否有帮助，但这对我有用，因为一次改变一个轴并检查位置是一件令人头痛的事情。另外，让你的调整剧烈+/- 300，这样你就知道它调整了哪个角度，因为我很确定我的轴搞砸了。我不确定方向是否希望我将跟踪的对象放在表面上而不是在我的手中 - 但这使得测试变得困难。

此外，在 Safari 中使用 iPhone 效果很好，但在 Chrome 上使用 Android 则存在跟踪和位置问题。

我在 Safari 上使用 iPhone 设置跟踪和位置，然后使用其他设备进行验证。

归档时间：	5 年，1 月前
查看次数：	4513 次
最近记录：	4 年，1 月前