Three.js 将地图分配给 object.children[0] 会更改整个对象的地图

Question

我正在尝试将映射分配给一个 obj 文件中使用 OBJLoader 加载的每个对象，这是有效的。问题是当我试图将其他地图分配给该文件中的一个对象并将其余部分保留在以前的地图中时。它会为每个对象更改贴图。

function loadOBJ( geometry, name ) {
loader.load( geometry, function( object ){
    object.traverse( function (child) {
        if ( child instanceof THREE.Mesh ) {
            child.material.map = map;
            child.material.envMap = textureCube;
            child.castShadow = true;
            child.receiveShadow = true;
            child.material.needsUpdate = true;
        }
    });

    object.children[0].material.map = new THREE.TextureLoader().load("img/ground.jpg");
    object.name = name;
    scene.add( object );
    console.log(object.name);
}); }

即使我运行只遍历 object.children[0] 并在那里分配地图，结果也是一样的。我做错了什么？

Answer 1

如果您更改 material 的属性，该更改将出现在共享该 material 的所有可渲染对象上。这很可能是你的情况。

使用此模式：

newMaterial = object.children[ 0 ].material.clone();

newMaterial.map = new THREE.TextureLoader().load( "img/ground.jpg" );

object.children[ 0 ].material = newMaterial;

three.js r.75

Three.js 将地图分配给 object.children[0] 会更改整个对象的地图

Three.js Assigning map to object.children[0] changes whole object's map

javascript

textures

three.js