2

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

 var newPos;
 var timer = 0;
 function render() {
  if (timer === 120) {
    for (var i = 0; i < count; i++) {
      mesh = meshes[i];
      newPos = new THREE.Vector3(Math.random() * 200 - 100, Math.random() * 200 - 100, Math.random() * 200 - 100);
      mesh.position.lerp(newPos, 0.5);
    }
  }

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

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

r83

也许这两个功能都不像我预期的那样工作。

4

1 回答 1

1

好的，我刚刚发现问题出在哪里。官方文档 中的Lerp 看起来像.lerp(v3, alpha)并且值alpha应该动态变化，所以我添加了时钟：

var delta = clock.getDelta();

现在和阿尔法：

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);
}

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

于 2017-05-20T13:26:09.303 回答