Question

我已将一堆stl加载到场景中。点击某个id，我想改变相关的stl的颜色。

发生的事情是，当点击一个id时，所有stls都会改变颜色并点击任何其他ID所有stls将运行else语句。

  var menuClick = document.getElementById('menu');
  var loader = new THREE.STLLoader();
  var loader2 = new THREE.STLLoader();
  loader.load('models/zBelts.stl', function(zBeltObj) {      //file location
   //create mesh from file and color var
    var zBeltMesh = new THREE.Mesh(zBeltObj, meshBaseColor);
    //rotate mesh
  zBeltMesh.rotateX( -Math.PI / 2 );
  scene.add(zBeltMesh);
  menuClick.addEventListener('click', function() {        //add event listener
    if (event.target.id === 'zbelt') {
      console.log(event.target.id);
               zBeltMesh.material.color.setHex(0xff0000);   //change color of selected object
                zBeltMesh.material.opacity = 1;
                zBeltMesh.material.transparent = true;

        }
    else {
                zBeltMesh.material.color.setHex(0xffffff);  //change color if not selected
                zBeltMesh.material.opacity = .4;
               zBeltMesh.material.transparent = true;

    }
});
});

    //zmotor
    loader.load('models/zMotor.stl', function(zMotorObj) {      //file         location cahnge this line
//create mesh from file and color var
        var zMotorMesh = new THREE.Mesh(zMotorObj, meshBaseColor); ///cahnge this line
                //rotate mesh
      zMotorMesh.rotateX( -Math.PI / 2 );
scene.add(zMotorMesh);    /////////change this line


menuClick.addEventListener('click', function() {        //add event listener
    if (event.target.id === 'zmotor') {
      console.log(event.target.id);
               zMotorMesh.material.color.setHex(0xff0000);   //change color of selected object
                zMotorMesh.material.opacity = 1;
                zMotorMesh.material.transparent = true;

        }
    else {
                zMotorMesh.material.color.setHex(0xffffff);  //change color if not selected
                zMotorMesh.material.opacity = .4;
               zMotorMesh.material.transparent = true;

    }
});
  });

Answer 1

所有模型共享相同的材质（meshBaseColor），这意味着当您更改zBeltMesh.material.color时，这也会更改zMotorMesh.material.color

创建一个＆＃34;选择材料＆＃34;在代码的开头，将此材料分配给click事件中的选定元素。取消/覆盖选择后，请小心重新分配旧材料。

点击时更改stl对象颜色

1 个答案: