如何更新三種材質數據？

Question

我想根據單選按鈕選擇更改對象的材質。在我目前的例子中，顏色變化起作用。不幸的是，它不會更新整個材料。

我該如何告訴THREE相應地更新其內部數據？

材料

var lederfaserMap = THREE.ImageUtils.loadTexture('textures/lederfaser.jpg'); 
    lederfaserMap.anisotropy = 16; 
    lederfaserMap.wrapS = lederfaserMap.wrapT = THREE.RepeatWrapping; 
    lederfaserMap.repeat.set(5, 5); 


    var feinleinenMap = THREE.ImageUtils.loadTexture('textures/feinleinen.jpg'); 
    feinleinenMap.anisotropy = 16; 
    feinleinenMap.wrapS = feinleinenMap.wrapT = THREE.RepeatWrapping; 
    feinleinenMap.repeat.set(8, 8); 


    var material = {  
    "feinleinen-schwarz":  new THREE.MeshPhongMaterial({ color: 0x222222, map: feinleinenMap, combine: THREE.MixOperation}), 
    "feinleinen-weiss": new THREE.MeshPhongMaterial({ color: 0xffffff, map: feinleinenMap, combine: THREE.MixOperation }), 
    "lederfaser-schwarz":  new THREE.MeshPhongMaterial({color: 0x222222, map: lederfaserMap, combine: THREE.MixOperation }), 
    } 

更新這裏的材料

var group = new THREE.Group(); 

loader.load('/models/object.js', function(geometry){ 
    var materialchange= new THREE.Mesh(geometry, material[ "feinleinen-schwarz" ]); 
    materialchange.name = "materialchange"; 
    group.add(materialchange); 
}); 

    scene.add(group); 



function animate() { 

    requestAnimationFrame(animate); 
    TWEEN.update(); 
    renderer.render(scene, camera); 

} 

功能來獲取和更新材料

function colorTo (target, value){ 
     var target = scene.getObjectByName(target); 
     var initial = new THREE.Color(target.material.color.getHex()); 
     var value = new THREE.Color(value.color.getHex()); 
     var tween = new TWEEN.Tween(initial).to(value, 500) 
      .easing(TWEEN.Easing.Cubic.InOut) 
      .onUpdate(function(){ 
       target.material.color = initial; 
      }) 
      .start(); 
    } 

功能得到檢查單選按鈕的屬性

$("input[name=material]").change(function(event){ 
    if ($(this.checked)) { 
     var targetColor = $(this).data("visual"); 
      colorTo("materialchange", material[targetColor]); 
     } 
    }); 

Answer 1

你需要做的是遍歷對象爲新顏色分配給它的所有子部分：

object.traverse (function (child) { 

    if (child instanceof THREE.Mesh) 
     child.material.color.copy = new_color; 

}