Question

A帧和编码的新手，试图在标记上显示3d扫描的对象。我将.gtlf上传到我的资产文件夹，并且在查看Galaxy s9 +上的Hiro标记时未加载该文件。

我添加了（scale =“ 0.2 0.2 0.2”），但这不起作用。

使用http://github.khronos.org/glTF-Validator/来确保我的.gtlf是有效的。

尝试了.gtlf和.glb来查看是否是问题所在，但两者均未加载。

<!DOCTYPE html>
<html>
  <head>
    <title>Pizza test hoho</title>
    <meta name="description" content="Let's hope this work!">
    <link id="favicon" rel="icon" href="https://glitch.com/edit/favicon-app.ico" type="image/x-icon">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script>
    <!--     Save commit version of aframe-arjs before the rewrite around August 8, 2017 -->
    <script src="https://cdn.rawgit.com/jeromeetienne/AR.js/ec578832d908e3b33bb1da9c649543e151395c21/aframe/build/aframe-ar.min.js"></script>
    <script>THREEx.ArToolkitContext.baseURL = 'https://rawgit.com/jeromeetienne/ar.js/master/three.js/'</script>
    <script src="./js/index.js"></script>
    <style>
      .note {
        position: absolute;
                     top: 1%;
                     left: 1%;
                     color: black;
                     text-shadow:
                     -1px -1px 0 #BBB,
                     1px -1px 0 #BBB,
                     -1px 1px 0 #BBB,
                     1px 1px 0 #BBB;
      }
      a-scene {
        pointer-events: none;
      }
    </style>
  </head>
  <body>
    <div class="note" style="position: absolute;
                     top: 1%;
                     left: 1%;
                     color: black;
                     text-shadow:
                     -1px -1px 0 #BBB,
                     1px -1px 0 #BBB,
                     -1px 1px 0 #BBB,
                     1px 1px 0 #BBB;">
      You'll need to have <a href="https://jeromeetienne.github.io/AR.js/data/images/HIRO.jpg">this image</a> printed or just displaying on your phone!
    </div>
    <a-scene artoolkit="sourceType: webcam;" embedded="embedded">

        <a-marker-camera preset="hiro">

            <a-entity gltf-model="https://cdn.glitch.com/168b6551-08b1-4c03-b4ae-f1f4ca3e8031%2FPizza.glb?1557619896347" scale="0.2 0.2 0.2"></a-entity>

        </a-marker-camera>
    </a-scene>

  </body>
</html>

Answer 1

问题在这里：

1）框架版本

框架0.6.0我相信使用了gtlf 1.0。切换到0.9.2。
在docs中：https://aframe.io/releases/0.9.1/aframe.min.js
ar.js也具有不同的链接（可能不太相关）
Docs：https://cdn.rawgit.com/jeromeetienne/AR.js/1.6.2/aframe/build/aframe-ar.js

2）模型（至少是.glb文件）为63兆字节。考虑到您是用手机制造的，使用wifi需要花费几秒钟的时间，但我不希望有人将这么大的文件作为网站资产加载。

这可能是我的看法，但是模型越复杂，在手机上正常运行的可能性就越小。

在this glitch，您可以检查它是否正常工作-已在我的PC上试用过，并在Andoid Firefox上试用过。

A-Frame和编码的新手，尝试加载.gtlf模型但不起作用

1 个答案: