曲线路径向量模型角度跟随

68 阅读1分钟
const curve = new THREE.CatmullRomCurve3([
  new THREE.Vector3(-10, 0, 0),
  new THREE.Vector3(-5, 5, 0),
  new THREE.Vector3(0, 0, 0),
  new THREE.Vector3(5, -5, 0),
  new THREE.Vector3(10, 0, 0)
]);

// 创建模型(示例使用立方体)
const geometry = new THREE.BoxGeometry(1, 1, 1);
const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
const model = new THREE.Mesh(geometry, material);
scene.add(model);

let t = 0; // 路径进度

function animate() {
  requestAnimationFrame(animate);

  t += 0.005;
  if (t > 1) t -= 1; // 循环路径

  // 获取当前位置和切线
  const position = curve.getPoint(t);
  const tangent = curve.getTangent(t).normalize();

  // 更新模型位置
  model.position.copy(position);

  // 方法1:使用lookAt调整朝向
  const target = position.clone().add(tangent);
  model.lookAt(target);

  // 方法2:使用四元数调整朝向(适用于Z轴为前方向)
  // const quaternion = new THREE.Quaternion();
  // quaternion.setFromUnitVectors(new THREE.Vector3(0, 0, 1), tangent);
  // model.quaternion.copy(quaternion);

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