2

我使用 Three.js 库从单个 dae/Collada 场景文件中加载和显示对象。该文件是使用 ColladaLoader（来自 Three.js 的示例代码）加载的，然后我使用该函数找到各个对象colladaScene.getChildByName('ObjectName', true);。这很好用，但渲染时会出现莫尔条纹。

由于任意加载的场景包含在 Blender 中编辑的复杂对象，我无法对对象或任何纹理做出任何假设。即我不能硬编码任何纹理或材料的特定更改/修复，因为我不知道期望什么纹理或材料。修复或调整必须是通用的，以便可以应用于具有多个纹理的不同对象。不能假定纹理尺寸符合 2 的幂，因为我们无法指导创建场景文件的人员。

问题：当使用 Web-GL 显示多个对象时，我在几个对象上遇到了非常糟糕的莫尔条纹问题。这些物品中有几个具有条纹纹理（深色木材和黑色）以及砖墙（不同颜色）。当以不同的角度和距离渲染时，这些条纹和砖块对象会出现严重的莫尔条纹伪影。这是一个条纹对象的示例。这是一个带有条纹纹理的盒子几何体。 http://imgur.com/a/vKsi3#0

是否可以更改纹理材质或纹理本身的设置以使莫尔伪影消失？我可以更改过滤器设置、着色器设置或创建 mipmap 纹理吗？由纹理尺寸引起的莫尔条纹是否不符合 2 次经验法则？加载 Collada 场景后，我们如何在 Javascript 中创建抗锯齿 mipmap？我们可以让 Blender 创建 mipmap 吗？我无法让 Blender 以 Collada 格式导出 mipmap。我已经在 Blender 中的对象纹理上检查/取消选中“自动 mipmap”，但无济于事。

请帮我。是过滤器、着色器还是 mipmap 的问题？有没有人有加载 Collada 场景的示例代码，然后遍历对象设置/更改对象以即使在“奇怪的角度和距离”下也能顺利渲染？

作为最后的手段，如果无法通过 Three.js 中的 Javascript 完成任何操作：有什么方法可以在 Blender 中打开场景并更改材质/纹理设置以使对象在导出到 Collada 文件时渲染得更好？

当我在加载到 Three.js 时显示条纹对象时，它看起来像（我已经包含了我什至远程想象对渲染有任何影响的所有内容）：

THREE.Mesh
    children: Array[0] // No child objects.
    material: THREE.MeshPhongMaterial
        blendDst: 205
        blendEquation: 100
        blendSrc: 204
        blending: 1
        map: THREE.Texture
            anisotropy: 1
            format: 1021
            generateMipmaps: true
            image: <img>
                height: 474
                width: 1395
            magFilter: 1006
            mapping: THREE.UVMapping
            minFilter: 1006
            mipmaps: Array[0]
            premultiplyAlpha: false
            type: 1009
            metal: false
            morphNormals: false
            morphTargets: false
            normalMap: null
            opacity: 1
            shading: 2
            skinning: false
4

1 回答 1

0

刚刚发现表明这可能是图像大小问题的东西。显然，当图像没有保持严格的二维幂时，OpenGL 3 和 WebGL 会发疯。发生这种情况时，mipmaps 会退出窗口并拒绝工作。这里有很好的讨论：WebGL 和两种图像大小的力量

于 2013-01-09T23:04:06.930 回答