Question

我正在学习矢量以及如何在ThreeJS中使用它们移动对象。作为一个简单的实验，我正在使用速度和任意重力矢量发射一个盒子。

我也试图定位物体以使其与其所遵循的弯曲路径相匹配，看起来它开始正确但在中途后开始转回。

此外，我一直在学习的例子不是JS，他们做的事情如下：

position = position + velocity * delta;
velocity = velocity + gravity * delta;

但是你不能在JS中做同样的事情，所以我一直在乘以一个标量，我是否在正确的轨道上？

这是我的渲染功能：

function render(){
    var delta = clock.getDelta();

    velocity.add(velocity.clone().multiplyScalar(delta));
    velocity.add(gravity.clone().multiplyScalar(delta));

    box.position.add(velocity);

    var theta = velocity.angleTo(z);
    box.rotation.x = (theta);

    requestAnimationFrame(render);
    renderer.render(scene, camera);
}

更新：根据WaclawJasper回答 JSFIDDLE DEMO HERE

，我最终做了什么

function render(){
    var delta = clock.getDelta();

    velocity.addScaledVector(gravity, delta);
    position.add(velocity);

    axis.crossVectors(up, velocity.clone().normalize()).normalize();
    radians = Math.acos(up.dot(velocity.clone().normalize()));
    box.quaternion.setFromAxisAngle(axis, radians);

    box.position.set(position.x, position.y, position.z);

    requestAnimationFrame(render);
    renderer.render(scene, camera);
}

Answer 1

JS不支持运算符重载，但position = position + velocity * delta基本上意味着将delta乘以速度乘以位置。在其他语言中，操作可以根据每个参数的类型具有不同的含义。这里因为delta是一个数字而速度是vec3，所以它意味着缩放矢量。幸运的是，ThreeJS确实为您提供了addScaledVector。

对于旋转，最简单的方法是改变方向，使模型面向的方向等于其速度。而这样做的功能是matrix4.lookAt。 matrix4.lookAt(v3(0,0,0),velocity, UP)应该为您提供正确的旋转矩阵，您所要做的就是将其应用于模型。

旋转对象以匹配轨迹

1 个答案: