物体沿路径匀速运动

Question

我有一个由多段线(3D点阵)组成的物体路径，点的分布非常不均匀。我需要使用一个间隔时间为10毫秒的定时器以恒定的速度移动一个物体。

不均匀分布的点在人眼里会产生不同的速度。所以现在我需要决定如何处理这个长长的3D点阵列。

我得到的第一个想法是将长段细分为小部分。它的效果比较好，但是在点被卡住的地方，问题依然存在。

在这些情况下，最好的方法是什么？另一个想法，可能是简化原始路径，用 Ramer-Douglas-Peucker算法。，然后再把它平均分割，但我不知道这样是否能完全解决我的问题。

这在3D图形的很多领域应该是一个相当普遍的问题，那么是否存在一个行之有效的方法呢？

Answer 1

我为你做了一个JavaScript笔 https:/codepen.iodawkenpeneYpxRmN?editors=0010。 但在其他语言中应该非常相似。点击矩形来添加点。

你必须保持一个时间依赖的 distance 以恒定的速度，类似这样。

const t = currentTime - startTime;
const distance = (t * speed) % totalLength;

然后你必须找到路径上的两点，使当前的距离介于这两点之间 "距离" 路径上，您可以将 "距起点的距离" 每点 {x, y, distanceFromStart}. 第一点 points[i] 以致于 distance < points[i].distanceFromStart 是你的目的地；在那之前的点 points[i - 1] 是你的来源。你需要在它们之间进行线性插值。

假设你有 无重复点 (否则就会被零除)你可以这样做。

for (let i = 0; i < points.length; i++) {
  if (distance < points[i].distanceFromStart) {

    const pFrom = points[i - 1];
    const pTo = points[i];
    const f = (distance - pFrom.distanceFromStart) / (pTo.distanceFromStart- pFrom.distanceFromStart);
    const x = pFrom.x + (pTo.x - pFrom.x) * f;
    const y = pFrom.y + (pTo.y - pFrom.y) * f;
    ctx.fillRect(x - 1, y - 1, 3, 3);
    break;
  }
}

看到这支笔。点击长方形来加点。https:/codepen.iodawkenpeneYpxRmN?editors=0010。