如何通过Alpha通道向Aframe和AR.js添加gltf模型？

Question

-更新-I have added this code似乎有所帮助。我可以看到玻璃现在很透明，但是仍然非常黑。

警告：我是WebAR的新手（和一般的编码人员）....但请放心，我已经花了数天时间在Internet上进行搜索以弄清这一点。

我试图将gltf模型与AR.js和Aframe结合使用以实现WebAR体验。这是我的代码的一部分：

<script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script> 
<script src="build/aframe-ar.js"></script> 
<script src="https://rawgit.com/donmccurdy/aframe-extras/master/dist/aframe-extras.loaders.min.js"></script>

<!-- marker -->
<a-marker type='pattern' url='https://raw.githubusercontent.com/merowell/Evidence-Collection-Procedures/master/assets/markers/patt/pattern-biological-1.patt'>

<!-- add .gltf model-->
    <a-entity gltf-model="https://raw.githubusercontent.com/merowell/Evidence-Collection-Procedures/master/assets/models/biological/biological.gltf" position="0 0 0" crossOrigin="anonymous" rotation="0 0 0" scale=".3 .3 .3">
    </a-entity>

我已经弄清楚了如何使gltf模型与纹理一起使用，但是我仍然似乎无法获得我想要的确切外观。通常，瓶子上的玻璃应该是透明的而不是不透明的。我在Blender 2.82中导入并编辑了模型。我正在使用Principled BSDF节点并将Blend模式设置为“ alpha blend”

这是屏幕截图：

导出模型后，我在gltf validator中对其进行了测试，看起来就像我想要的那样。这是屏幕截图：

不幸的是，活动标记不会以相同的方式显示它。也许我还需要做一些其他事情才能使Alpha通道正常工作？还是我的代码有错误？ 这是活动标记的屏幕截图：

最后，我尝试将模型添加为glb文件（列为资产）。但是，当我在a-scene标签中列出资产时，网络摄像头将不会部署。但是，我已经读过其他人使用这种方法。

Answer 1

已编辑-问题仍然存在。...这些模型仅相对于其他模型是透明的。但是您无法通过透明材质看到真实的环境（就像使用波前obj一样）

This solved the issue ...，我只需要转到Blender文件并以较浅的颜色重新导出模型，即可使其看起来像我想要的样子。