Three.js 部分拉伸纹理

Question

我正在使用 Collada 加载器在 Three.js r65 中加载我的 3D 对象。在加载回调中，我使用以下代码立即将纹理应用于模型的所有部分。

var loader = new THREE.ColladaLoader();

loader.options.convertUpAxis = true;
loader.load('obj/cdg/Grenada-test1.dae', function(collada) {

    var texture = new THREE.ImageUtils.loadTexture("../models/textures/Gr1 08869 Bready Grey.jpg");


    var material = new THREE.MeshPhongMaterial({map: texture, tranparent: true});
    for (var i = 0; i < collada.scene.children.length; i++) {
        collada.scene.children[i].material = material;
    }

});

在 Three.js 中它看起来像这样（纹理在某些位置被拉伸）。

该对象在应用了纹理的 Unity 3D 中显示良好，请参见下图。

我尝试过的：

• 在 Three.js 和 Blender 中更新 UV 贴图
• 在不同的程序（Unity 3D）中加载模型以查看问题是否出现在那里
• 搜索了许多SO问题，但无济于事

有人知道这里发生了什么以及我如何解决这个奇怪的纹理问题吗？

提前致谢！

编辑：

这是它的样子 texture.repeat.set( 2, 2 )

这是看起来像 texture.repeat.set( 10, 10 )

纹理重复使纹理消失，纯色正在取代纹理......

Answer 1

将wrapS和wrapT属性设置为THREE.RepeatWrapping：

texture.wrapS = THREE.RepeatWrapping;
texture.wrapT = THREE.RepeatWrapping;

并确保您的纹理是“2 的幂”。即 16x16、32x32、64x64、128x64 等