阿嬤碎碎念
在這篇文章中，我們將學會如何在二維平面上，模擬一個 Random Walker (隨機漫步者)。我們可以藉著操縱一個物體的位置 (Position)，來讓他在平面上到處亂走。我們將學會向量、隨機、位置等概念。
Vector 向量
向量 (Vector) 是一個數學工具，時常用於數學、物理中。向量具有兩個特徵：
- 方向
- 長度
因此我們可以很自然的用向量來表示一個物體或一個粒子的速度 (Velocity)、加速度(Acceleration)、動量 (Momentum) 等等，這些性質我們會在未來的文章中使用到。當然，也可以用向量來表示一個物體在座標中的位置 (Position)。這篇文章將實做透過改變一個粒子的位置來模擬一個 Random Walker。
Random Walker 隨機漫步模擬
我們先定義一個 class Walker，並將他的位置以一個向量表示。每次 update 的時候都讓他的位置的 x 值移動 random(-2, 2)， y 值也移動 random(-2, 2)。最後在 show函式內定義如何成現在 Canvas 上。
class Walker {
constructor(x, y) {
this.pos = createVector(x, y);
}
update() {
this.pos.x = this.pos.x + random(-2, 2);
this.pos.y = this.pos.y + random(-2, 2);
}
show() {
stroke(255, 100);
strokeWeight(2);
point(this.pos.x, this.pos.y);
}
}因為向量的疊加性，以下的程式碼可以理解成 :
- 粒子的位置的 x 分量經過一個 timestep 後，增加了從 -2 到 2 中間的一個隨機值。
- 粒子的位置的 y 分量經過一個 timestep 後，增加了從 -2 到 2 中間的一個隨機值。
update() {
this.pos.x = this.pos.x + random(-2, 2);
this.pos.y = this.pos.y + random(-2, 2);
}Random Walker 模擬:
其實我們可以觀察到，因為每個 timestep，移動的期望值其實都是 0，因此我們可以假定粒子其實會在畫面的中間附近移動，不會偏離太多。讀者可以試試看調整不同 random 函數中的值，觀察粒子移動的軌跡如何改變。
程式碼
可以從以下連結線上執行看看程式碼:
參考
本篇文章主要參考 The Nature of Code ，以及作者的 Youtube:
