时间戳

首页 > 解决方案 > Three.js - 多次使用时更改特定 GLTF 的材质

javascript - Three.js - 多次使用时更改特定 GLTF 的材质

问题描述

我目前正在加载一个 GLTF 资产并在场景中多次使用它。

我想更改作为 GLTF 的目标对象内所有网格的材质颜色。

traverseMaterials(object, (material) => {
    material.color.set(
        object.info.model.color
    );
});

这是可行的，但是它会更改所有其他 GLTF 对象。

我的目标是更改目标对象及其子网格材料的颜色。（并非所有这些都适用于所有使用过的 GLTF）

我试过了，但没有任何反应。

traverseMaterials(object, (material) => {
    let clonedMaterial = material.clone();
    material = clonedMaterial;
    material.color.set(
        object.info.model.color
    );
});

这里是 traverseMaterials 函数供参考

function traverseMaterials (object, callback) {
     object.traverse((node) => {
     if (!node.isMesh) return;
     const materials = Array.isArray(node.material)
     ? node.material
     : [node.material];
     materials.forEach(callback);
  });

}

标签： javascriptthree.js

解决方案

材料=克隆材料；

只是这样做不会改变node.material. 这意味着您实际上必须将克隆的材料分配给node.material.

推荐阅读