Question

我无法使用tween.js在three.js中停止补间。文档声明使用tween.stop()，但这似乎不起作用。

当您将鼠标悬停在方框上时，它会开始改变颜色。这个动画需要10秒钟，但我试图阻止它只是为了使用setTimeout(function(){ tween.stop() }, 1000);测试.stop（）功能，但它没有做任何事情......

非常感谢任何帮助！

Answer 1

有参考问题和更新问题。我对你的代码做了一些修改。它不是解决方案，您可以单独使用每个更改。最好的解决方案是将每个补间作为函数内的var，在补间对象中集成计数并使用onUpdate（function（）{if（this.counter＆gt; 1000）{tween.stop}}）（INTERSECTED.material.color）因为你创建了很多未引用的计时器和补间，这将是一个性能问题。

function animate() { 
      //
      TWEEN.update();
      //
}

    if (intersects.length > 0) {

        if (INTERSECTED != intersects[0].object) {

            if (INTERSECTED) INTERSECTED.material.color.setHex(INTERSECTED.currentHex);

            INTERSECTED = intersects[0].object;
            INTERSECTED.currentHex = INTERSECTED.material.color.getHex();
            //INTERSECTED.material.emissive.setHex(0xff0000);
            TWEEN.remove(tween);
            tween = new TWEEN.Tween(INTERSECTED.material.color).onStart(function(){

      setTimeout(function(){ tween.stop() }, 1000); ///not good
}).start();     
            .to({r: 0, g: 25, b: 155}, 10000) /// here set correct time
            .easing(TWEEN.Easing.Quartic.In)
            .start();

            setTimeout(function(){ tween.stop() }, 1000);/// will not work if you create anoter it that one second

        }
        else {
            if(tween) tween.update(time); // bad
        }

    }

停止tween.js和three.js中的补间动画

1 个答案: