使用 THREE.js 在顏色之間淡入淡出

Question

我在 THREE.js 中有一個簡單的立方體：

        var cubeMaterial = new THREE.MeshLambertMaterial({color: 0xCC0000});

    var cube = new THREE.Mesh(
        new THREE.CubeGeometry(100, 100, 100),
    cubeMaterial);
    cube.position.set(0.7,1.95,-0.1);
    cube.scale.x = cube.scale.y = cube.scale.z = 0.002;
    scene.add(cube);

關於如何即時更改材料顏色的任何建議？ 我想要實現的是平滑的淡入淡出（例如從紅色到綠色）並且能夠動態地淡化顏色。 所以我的猜測是它需要在渲染循環中不斷地重新渲染，然后應該以某種方式改變顏色，使其逐漸淡化為目標顏色。 但我不太確定如何在代碼中做到這一點..

提前致謝！

安德斯

Answer 1

您可以使用 TWEEN.js： https : //github.com/sole/tween.js/

在這個 Stackoverflow 問題中有一個很好的解決方案： 如何使用three.js 在兩種顏色之間進行補間？