Three.js纹理模型没有在对象上正确应用

Question

我有一个冲浪板obj文件，我想在顶部和底部面上应用纹理，但是当我希望它应用于整个面部时，纹理在中间分裂。 材料也被施加在网格内部。 问题与模型有关，还是我错过了代码中的某些内容？

var loader = new THREE.OBJLoader();

    var texture = new THREE.Texture();
    var ImageLoader = new THREE.ImageLoader();
    ImageLoader.load("models/white.jpg", function (image) {
        texture.image = image;
        texture.needsUpdate = true;
    });

    var custom = new THREE.Texture();
    var customLoader = new THREE.ImageLoader();
    customLoader.load("models/UV_Grid_Sm.jpg", function(image) {
        custom.image = image;
        custom.mapping = THREE.UVMapping;
        custom.needsUpdate = true;
    });


    loader.load("models/Hidden 5'4-19'5-2 (Holes_Patched).obj", function(object){
        object.traverse(function(child) {

            if (child instanceof THREE.Mesh) {

                if(child.name === 'Bottom') {
                    child.material = new THREE.MeshStandardMaterial({ map: custom});

                }
                else if(child.name === 'Top') {
                    child.material = new THREE.MeshStandardMaterial({ map: custom});

                }
                else  {
                    child.material = new THREE.MeshStandardMaterial({ map: texture});

                }
            }

        });

在这里下载obj文件该对象有两个名为“Top”的组，但我可以稍后更改。

Answer 1

您需要在模型上添加/设置UV坐标。 这需要在3d软件（例如3DS Max）中完成。
此外，您应该通过删除不需要的边和顶点来清理/优化您的模型（134,000个顶点？）