如何在Three.js中点击更改几何颜色

Question

我是three.js的新手。我在官方网站上找到了一个例子。我想通过单击按钮来更改几何的颜色。我怎样才能做到这一点？我尝试使用鼠标单击事件来执行此操作，但这没用。

function init(){

......
......
......
  $("red").onclick(function (e) {
            rollOverMesh.material.color=0xff3333;
        });

}

Answer 1

假设rollOverMesh是一个Mesh。请尝试

var onClick = function() {
  rollOverMesh.material.color = new THREE.Color(0xffffff * Math.random());
  rollOverMesh.material.needsUpdate = true;
};

$('red').click(onClick);

如果要在实时场景中更改材质，则必须再次设置材质。

JSFiddle：https://jsfiddle.net/bkr1gc4e/

Answer 2

您只需要像这样设置颜色即可：

rollOverMesh.material.color = new THREE.Color(0xff3333);