[英]How to rotate each particle on its axis in a Particle system in THREE.js?
I am making a space scene in which I am using a particle system to make group of asteroids, I want to rotate each asteroids on its axis. 我正在制作一个太空场景,其中我正在使用粒子系统制作一组小行星,我想沿其轴旋转每个小行星。 I am using following code for making a particle system. 我正在使用以下代码来制作粒子系统。
var asteroidGeometry = new THREE.Geometry();
for(var i=0;i<=10000;i++)
{
asteroidGeometry.vertices.push( new THREE.Vector3( Math.random()*10000-5000, Math.random()*10000-5000, Math.random()*10000-5000 ) );
}
var asteroidtexture= THREE.ImageUtils.loadTexture("images/asteroids.png");
var asteroidMaterial = new THREE.ParticleBasicMaterial({color: 'white',size:500,map:asteroidtexture,alphaTest: 0.8});
asteroids = new THREE.ParticleSystem(asteroidGeometry,astroidMaterial);
scene.add(asteroids);
If I will do something like 如果我会做类似的事情
asteroid.position.x +=0.1;
then this will rotate whole system. 然后这将旋转整个系统。 Is it possible to rotate each particle on its on axis? 是否可以在轴上旋转每个粒子?
Individual vertices in a THREE.Geometry
instance are accessible via its vertices
array. THREE.Geometry
实例中的各个顶点可以通过其vertices
数组访问。
I found a tutorial that explains how to animate particles in a particle system independently. 我找到了一个教程 ,该教程解释了如何独立地对粒子系统中的粒子进行动画处理。 Here's the relevant section of the update
animation loop with some minor modifications. 这是update
动画循环的相关部分,其中进行了一些小的修改。
function update() {
var pCount = particleCount;
while (pCount--) {
var particle = particles.vertices[pCount];
if (particle.position.y < -200) {
particle.position.y = 200;
particle.velocity.y = 0;
}
particle.velocity.y -= Math.random() * .1;
particle.position.addSelf(particle.velocity);
}
particleSystem.geometry.__dirtyVertices = true;
renderer.render(scene, camera);
requestAnimFrame(update);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.