Question

X和y是对象的坐标。 Z始终为0.如何使用Three.js将此对象移动（使用可见移动动画，而不是在不同位置弹出）到新位置？

编辑：对象（网格）的代码示例

var mesh = new THREE.Mesh(new THREE.PlaneBufferGeometry(2, 2), new THREE.MeshBasicMaterial({img: THREE.ImageUtils.loadTexture('img.png')}))
scene.add(mesh)

编辑2：我可以使用mesh.position.x = newx和mesh.position.y = newy使我的网格跳转到新位置，但我希望它看起来像JQuery animate（）中那样平滑。

Answer 1

动画任何类型对象的关键是以高刷新率移动小金额。

这意味着多次渲染场景，但是按照您希望每帧的方向移动对象。

e.g。

var direction = new THREE.Vector3(0.3, 0.5, 0); // amount to move per frame

function animate() {
  object.position.add(direction); // add to position

  renderer.render(camera, scene); // render new frame

  requestAnimationFrame(animate); // keep looping
}

requestAnimationFrame(animate);

如何在Three.js中将对象从位置{x，y}移动到{newx，newy}

1 个答案: