寻找一种为我的threejs场景创建时间表的方法

Question

我正在做一个项目，您可以在此查看游艇比赛重播。使用threejs和补间。尝试创建时间轴以便可以更改重播速度，也可以将其向前移动，而无需等待30秒钟左右，直到补间达到该点为止。

使用此代码创建补间并将其链接：

    createTweens(){
        let tweens = [];
        let position = {
            x: this.yacht.position.x,
            y: this.yacht.position.z,
            z: this.yacht.rotation.z
        };
        for (let i = 0; i < this.path.length; i++){
            let target = {
                x: this.path[i].x,
                y: this.path[i].y,
                z: this.path[i].a
            };
            let tween = new TWEEN.Tween(position).to(target, 1000);
            tween.onUpdate(() => {
                this.yacht.position.x = position.x;
                this.yacht.position.z = position.y;
                this.yacht.rotation.z = position.z;
            });
            tween.easing(TWEEN.Easing.Linear.None);
            // tween.start();
            tweens.push(tween);
        }
        for (let i = 0; i < tweens.length-1; i++) {
            tweens[i].onComplete(()=> tweens[i+1].start());
        }
        this.tween = tweens[0];
    }

像这样开始补间：

manage.yachts[1].tweens[0].start();

我想以某种方式使所有这些补间都可以使用时间轴。 或者，即使有可能使用其他任何方式实现时间轴而无需补间。