模拟运动类似尘埃粒子

我试过用css和animate对setInterval循环。这两种移动方式都是由oldpos1-> newpos1的微小移动构成的，没有随机的曲线移动，但是jQuery的动画效果很好，但是只能在随机生成的1-3像素之间进行，这不是我想要的。问题在于setInterval的时钟，只有线性时间单元流动吗？模拟运动类似尘埃粒子

我应该从哪里开始，使jQuery下面的图像存在？

我想这样做：

道奇行为：

A，B - 颗粒

AB1 - 共同躲闪区，只有一定量的

enter image description here

2运动：

AV，BV - 随机圆形运动

AACC，BACC - 其中所述微小随机加速度发生（使图像标记为更condenced虚线）

enter image description here

来源

2011-11-29 a clever name

你应该像随机变化的加速度那样获得路径。 –

我不会依赖jQuery的animate这个，因为你的情况比较特殊......相反，使用“游戏循环模式”：有一个游戏对象，它保持一组粒子，这些粒子被移动（碰撞......）和然后在常规的interv阿尔斯。

这里的一个基本结构：

function Particle(x, y) { 
    this.x = x; 
    this.y = y; 
    this.speed = 0; // in pixels per second 
    this.direction = 0; // in radians per second 
} 

Particle.prototype.move = function(d_time) { 
    this.x += Math.cos(this.direction) * this.speed; 
    this.y += Math.sin(this.direction) * this.speed; 
} 

Particle.prototype.draw = function() { 
    // either set the position of a DOM object belonging to this particle 
    // or draw to a canvas 
} 

function Game() { 
    this.particles = Array(); 

    this.MS_PER_FRAME = 20; // in milliseconds 
    this.D_TIME = 1000.0/this.MS_PER_FRAME; 
} 

Game.prototype.tick = function() { 
    $.each(this.particles, function(_, particle) { 
     particle.move(this.D_TIME); 
     particle.draw(); 
    }) 
} 

Game.prototype.go = function() { 
    setInterval(this.tick, this.MS_PER_FRAME) 
})

然后就可以操纵速度和粒子的方向，只要你喜欢，也许通过引入额外的部件d_speed（加速度）和d_direction左右。

来源

2011-11-29 06:39:53 wutz

是否有任何方式在JavaScript中制作半圆矢量路径，然后沿着该路径移动粒子，每次到达路径末尾时，脚本都会添加相同的半圆路径，但会将随机性留在路径大小，圆形翻转（如果以前路径已经变成了贝塞尔曲线，那么现在它会相同或下降）？ –

如果你采用上面的框架，并且每个帧/刻度添加一个常量'd_direction'到'direction'，那么粒子将会移动一圈。如果每n毫秒更改一次'd_direction'，则可以创建更复杂的移动模式，如您所描述的。 – wutz

模拟运动类似尘埃粒子

回答

相关问题