模擬運動類似塵埃粒子

我試過用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

模擬運動類似塵埃粒子

回答

相關問題