这是链接:https://sixteendollars.github.io/
如您所见，单击链接后，页面上会出现奇怪的黑色覆盖层。
此外，将相机指向我的标记图像 ( /image/1vCPx.png ) 时，它无法识别标记并像预期那样弹出 A 形框架实体。我不确定这是否是标记、模型、我访问 Assets 管道的方式或其他问题。
HTML:
<!DOCTYPE html>
<html>
<script src="https://aframe.io/releases/0.9.0/aframe.min.js"></script>
<script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.6.2/aframe/build/aframe-ar.js"></script>
<body style="margin : 0px; overflow: hidden;">
<a-scene embedded arjs="sourceType: webcam; debugUIEnabled: false;">
<a-marker type="pattern" url="assets/pattern-marker.patt">
<a-entity
obj-model= "obj: url(assets/Batman.obj);
mtl: url(assets/Batman.mtl)">></a-entity>
</a-marker>
<a-camera-static/>
</a-scene>
</body>
</html>
目录结构:
assets
pattern-marker.patt
Batman.obj
Batman.mtl
index.html
最佳答案
我把你的代码扔进了这个 codepen ，并且工作正常。但有几个问题。
1) 始终确保场景在没有 ar.js 的情况下表现如何
模型很大(你需要将其缩小一百倍)，并且“mtl”无法正常工作。您可以在 this 中看到它 fiddle 。
您可以使用 blender /玛雅或使用 scale 将其缩小。组件:
<a-entity scale='0.1 0.1 0.1'></a-entity>
2)“覆盖层”实际上是您的模型。 <a-marker-camera>应该用作场景的视点。如果您想在标记上放置 AR 内容，请使用 <a-marker> :
<a-marker type="pattern" url="assets/pattern-marker.patt">
<a-entity all-my-models></a-entity>
</a-marker>
<a-camera-static/>
与 <a-camera-static>相当于相机 ( source )
当标记消失时，<a-marker-camera>确保渲染的模型保留在屏幕上。所以您会看到加载模型的初始位置。
当您缩小模型并将其放入
<a-marker> 中时，您应该会看到型号(右侧的型号没有 mtl )
更新
这是一个非常具体的问题，所以我将其单独放置。
1) MTL。这些控制台错误表明您没有上传一些必要的文件
2) Github 页面。在我的笔记本电脑上加载需要一段时间，但它显然就在那里。在 Windows 上尝试过 Firefox/chrome。
关于javascript - A-Frame AR.js 应用程序无法识别我的标记图案，并且在加载页面时出现黑色覆盖层，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56398818/