javascript - three.js KeyframeTrack 的示例，带有平滑（三次插值）

Question

我正在寻找一些关于如何在 three.js 动画 KeyframeTrack 上实现平滑（又名三次插值）的清晰度。从我的测试来看，在 KeyframeTrack 构造函数中解析插值方法是不够的。

var position = new THREE.VectorKeyframeTrack(
    '.position',
    [0, 1],
    [
        plane.position.x,
        plane.position.y,
        plane.position.z,
        1.25 * plane.position.x,
        1.25 * plane.position.y,
        1.25 * plane.position.z
    ],
    THREE.InterpolateSmooth
);
position.createInterpolant();

var clip = new THREE.AnimationClip('Action', 3, [
    position
]);

that.mixer = new THREE.AnimationMixer(plane);

var action = that.mixer.clipAction(clip);
action.setLoop(THREE.LoopOnce);
action.startAt(0);                // delay in seconds
action.clampWhenFinished = true;
action.play();