【问题标题】：How I Can Solve Mesh Visual Problem in A-Frame AR?如何解决 A-Frame AR 中的网格视觉问题？
【发布时间】：2020-07-27 17:06:07
【问题描述】：

我是 javascript 和 a-frame 的新手。我开始使用它并在网站上加载我的模型

Link to Web-site

Link to Marker for AR

正如您在手机中看到的那样，网格的材料有误，并且网格的某些部分相互穿过？或者它是如何正确命名的......当三角形具有相同的位置并且相互剪辑时，它会发生在其他软件（Blender、Unity 和等）中。但是在 Blender Mesh 中没有这个麻烦......我可以用这个问题 #1 做什么？

第二个问题是错误的材料，在导出到 GLTF 之前在 Blender 中看起来不同。

Correct Materials Image

我如何改变材质的颜色，如果可以的话 - 如何理解我现在重新着色的网格子网格的那部分？我使用 GLTF 动画支持的原因。相反，我可以将 OBJ 与 MTL 一起使用。但是我读到如果我纠正它就没有动画......

我是新手，尝试使用简单的解决方案，因为这不是我的工作领域 - 我经常使用 Unity，但在这里我害怕代码 :)

很高兴看到您的建议或解决方案！谢谢！

【问题讨论】：

1) 在我的 android 10 手机上得到了类似 this 的信息。几乎与我在Don McCurdy's gltf viewer 上查看您的模型所得到的相同。如果您对 gltf 模型有问题，请始终在查看器中查找它们，或者至少在 a-frame（没有 ar.js）中查找，以确认问题是否与 gltf 导出器、a-frame 或 ar.js 有关。
2) Here 或 here 你有一个变色的例子。如果它太复杂，我可以举一个例子，我在你的模型中改变绿色的东西。
我已经管理了如何改变颜色，但下一个问题是动画无法使用动画混合器播放，但我检查了 gltf-model 包含“空闲”动画......
@Piotr Adam Milewski 我们可以在某个地方聊天吗？我不能让我的模型动画。现在有没有动画的机器人...

标签： javascript augmented-reality aframe

【解决方案1】：

通过网格视觉问题，我假设您的意思是左侧图像（胸部和手）上的此剪辑：

尽管模型在屏幕上看起来又近又小，但它远离原点和/或重新缩放。 z 缓冲区中的深度值在原点附近是精确的，但是对象移动得越远，它变得越差。您可以通过在渲染器中启用对数深度缓冲区（查看 this example）来解决它。

您可以通过将模型移开并放大（不使用 ar.js）来实现类似的“剪裁”效果：

<a-entity id="model" position="-1 0.5 -100" scale="40 40 40" gltf-model="#robot"

解决方案：

如上所述 - 您应该启用渲染器使用对数深度缓冲区：

// a-frame
<a-scene renderer="logarithmicDepthBuffer: true" ...

// three.js
var renderer = new WebGLRenderer({logarithmicDepthBuffer: true})
// or rendererReference.logarithmicDepthBuffer = true

但如果出于任何原因（性能？不知道，需要对其进行测试。）您需要另一种解决方案 - 使用 THREE.PerspectiveCamera() 而不是默认的也可以解决剪辑问题：
```
// ar.js needs to be up and running - wait until scene.systems["arjs"]._arSession is not null
scene.camera = new THREE.PerspectiveCamera()
```

【讨论】：

@Rakeshyadvanshi 很高兴我能帮上忙