javascript - 用three.js创建粒子动画

Question

我是three.js 的新手，我用three.js 创建了一个简单的粒子应用程序，但是粒子流正在从中心移动。我想移动粒子，例如在附加的屏幕截图中显示的东西（右上角到左下角）。工作代码位于https://jseditor.io/?key=ee98d51a9b4111eab74e00224d6bfcd5。任何参考都会非常有帮助。谢谢你。

标签： javascriptthree.jsparticles

Answer 1

您的updateParticles功能只是改变粒子的 z 位置：

particle.position.z +=  mouseY * 0.1;
if(particle.position.z>1000) particle.position.z-=2000; 

如果要垂直和水平移动它们，则还必须更新 x 和 y 位置。

particle.position.x -=  mouseY * 0.1;
particle.position.y -=  mouseY * 0.1;
if(particle.position.x<-500) particle.position.x+=1000;
if(particle.position.y<-500) particle.position.y+=1000;

我不知道您的场景的大小，因此您可能需要相应地调整数字。