如何在Object3D子网格上设置纹理

时间:2013-09-04 12:01:38

标签: javascript 3d three.js webgl

我像这样导入了我的Object3D:

var globalObject; // this is a global object

var loader = new THREE.ObjectLoader();
loader.load('path/to/object3d.json', function(object) {
    globalObject = object;
    scene.add(globalObject);
});

我想要实现的是当用户点击按钮时,整个对象的某些Mesh元素会获得纹理。我是这样做的:

// on button click {
    for(var i in globalObject.children) {
        // apply to Mesh of interest {
            var texture = THREE.ImageUtils.loadTexture('path/to/image.jpg');
            globalObject.children[i].material = new THREE.MeshLambertMaterial({map: texture, needsUpdate: true});
        } // end apply to Mesh of interest
    }
} // end on button click

上面的代码似乎可以设置纹理。这里的问题是纹理看起来有点扭曲。它看起来像http://db.tt/S5VEsByd

如何更正此问题,以便将完整纹理应用于两个表面?

1 个答案:

答案 0 :(得分:3)

这应该可以解决问题:

// on button click {
    for(var i in globalObject.children) {
        // apply to Mesh of interest {
            var texture = THREE.ImageUtils.loadTexture('path/to/image.jpg');
            texture.wrapS = THREE.RepeatWrapping;
            texture.wrapT = THREE.RepeatWrapping;
            globalObject.children[i].material = new THREE.MeshLambertMaterial({map: texture, needsUpdate: true});
        } // end apply to Mesh of interest
    }
} // end on button click