如何将自定义标记与 ar.js 一起使用

Question

我正在尝试使自定义标记在 ar.js 中工作，遗憾的是没有成功，希望有人能提供帮助。

我已经尝试了所有这些指南： https://medium.com/@aschmelyun/so-you-want-to-get-started-with-ar-js-41dd4fba5f81 https://medium.com/arjs/how-to-create-your-own-marker-44becbec1105 https://katharine.org/tutorials/custom-markers-ar-js/

遗憾的是它似乎不起作用。奇怪的是，使用 hiro 标记它仍然有效，尽管代码没有提到它......（我尝试仅为 katherine-tutorial 编辑 .js 文件）。

<!doctype HTML>
<html>
  <script src="aframe.min.js"></script>            
  <script src="aframe-ar.js"></script>            
<script src="aframe-gif-shader.js"></script>   

  <body style="margin : 0px; overflow: hidden;">    
    <a-scene embedded arjs="debugUIEnabled: false">  
      <a-assets> 
        <img id="asset" src="https://raw.githubusercontent.com/mayognaise/aframe-gif-shader/master/examples/basic/banana.gif">
      </a-assets>
      <a-marker preset='custom' type="pattern" url='testpattern.patt'> 
      <a-entity geometry="primitive:plane;width:2;height:2;"
      position="0 0 0"
      rotation="-90 0 0"
      scale="0.5 0.5 0.5"
      material="shader:gif;src:#asset;alphaTest:0.5;"></a-entity>
    </a-marker>
    <a-entity camera></a-entity>    
    </a-scene>
  </body>
</html>

（还有一个问题，当我在自己的网站空间上传完全相同的 gif 时，gif 不再使用该代码工作，有人知道为什么吗？）

Answer 1

ar.js 中的自定义标记只需要设置 type 和 url：

<a-marker type="pattern" url="url/to/mypattern.patt">
  <a-entity myobject></a-entity>
</a-marker>

您可以在这张 glitch using this 图片中查看。

如何将自定义标记与 ar.js 一起使用

How do I use Custom Marker with ar.js

javascript

html

augmented-reality

aframe

ar.js