Animation 三个JS lerp、LERPvector在没有动画的情况下工作

经过一段时间后，我试图通过函数lerp、lerpVectors在不同方向移动10个网格。他们两个给了我相同的结果，他们只是在新的位置传送网格，而没有移动到那里的动画。这是我的代码（带“lerp”）：

var-newPos；
var定时器=0；
函数render（）{
如果（计时器===120）{
对于（变量i=0；i

我相信还有另一种方法，通过计算距离，然后将它们减少到0。但是我想lerp和lervectors做同样的事情，所以问题是我做错了什么

r83

---

可能这两个函数的工作方式都不符合我的预期。

好的，我刚刚找到了问题所在。在中，看起来像.lerp（v3，alpha）并且值alpha应该是动态变化的，因此我添加了：

和alpha现在：

alpha += delta;

此外，我还向每个网格添加了布尔变量，以检查它是否足以执行lerp，此外，我在初始化过程中为每个网格设置了一个新位置，作为如下参数：

mesh.newPosition = new THREE.Vector3(
      Math.random() * 200 - 100, Math.random() * 200 - 100, Math.random() * 200 - 100
    );

因此，我更新了渲染函数：

var timer = 0;
var alpha = 0;
var delta;
var currentX, currentY, currentZ;

function render() {
  delta = clock.getDelta();
  for (var i = 0; i < count; i++) {
    mesh = meshes[i];

    if (timer === 120) {
      mesh.endTransition = false;
    }

    if (!mesh.endTransition ) {
      currentX = Math.abs(mesh.newPosition.x - mesh.position.x);
      currentY = Math.abs(mesh.newPosition.y - mesh.position.y);
      currentZ = Math.abs(mesh.newPosition.z - mesh.position.z);

      if (currentX >= 1 || currentY >= 1 || currentZ >= 1) {
        alpha += delta;
        mesh.position.lerp(mesh.newPosition, alpha);
      } else {
        mesh.endTransition = true;
      }
    }
  }

  timer++;
  renderer.render(scene, camera);
}

var定时器=0；
varα=0；
var三角洲；
无功电流X、电流Y、电流Z；
函数render（）{
delta=clock.getDelta（）；
对于（变量i=0；i=1 | | currentY>=1 | | currentZ>=1）{
α+=δ；
mesh.position.lerp（mesh.newPosition，alpha）；
}否则{
mesh.endTransition=true；
}
}
}
定时器++；
渲染器。渲染（场景、摄影机）；
}

也许我的解决方案可以改进

mesh.newPosition = new THREE.Vector3(
      Math.random() * 200 - 100, Math.random() * 200 - 100, Math.random() * 200 - 100
    );

var timer = 0;
var alpha = 0;
var delta;
var currentX, currentY, currentZ;

function render() {
  delta = clock.getDelta();
  for (var i = 0; i < count; i++) {
    mesh = meshes[i];

    if (timer === 120) {
      mesh.endTransition = false;
    }

    if (!mesh.endTransition ) {
      currentX = Math.abs(mesh.newPosition.x - mesh.position.x);
      currentY = Math.abs(mesh.newPosition.y - mesh.position.y);
      currentZ = Math.abs(mesh.newPosition.z - mesh.position.z);

      if (currentX >= 1 || currentY >= 1 || currentZ >= 1) {
        alpha += delta;
        mesh.position.lerp(mesh.newPosition, alpha);
      } else {
        mesh.endTransition = true;
      }
    }
  }

  timer++;
  renderer.render(scene, camera);
}