week 17

虎克彈簧

先建設背景，不畫線(noStroke())會使球型比較好看，再使用ellipse()，畫出球型。

如果中間要畫一條線，但我們已經把畫線這功能取消掉了，因此我們只要改變程式碼的順序就好，我們先畫出中間那條線，再處理旁邊不畫線的兩個小圓球，就能達到兩顆圓球(不畫線)，中間是畫出一條線的結果。

使用滑鼠讓線能伸展，因此原本的X和Y數值，不能使用固定數值，所以要使用變數讓他數值有所變化，再使用滑鼠的凾式(mouseDragged())，讓滑鼠拖曳小球使線能伸展。

拖曳小圓球放掉必須回原來的位置，虎克彈簧的概念，這個力量的大小，與數學的向量有關，先使用變數扣除原本的數值，再找長度兩個變數相乘並且再相加，使用sqrt()函式算出這個長度，之後dx再乘上長度剪掉100除以長度。
 if(!mousePressed)
  {
    float dx=x-100,dy=y-150;
    float len=sqrt(dx*dx+dy*dy);
    x -=dx*(len-100)/len;
    y -=dy*(len-100)/len;
  }
但這個彈簧他會一次就到目標點，只要我們乘上1/10，讓他每步慢慢走，就會有比較滑順的感覺。
float x=200, y=150;
 if(!mousePressed)
  {
    float dx=x-100,dy=y-150;
    float len=sqrt(dx*dx+dy*dy);
    x -=dx*(len-100)/len*0.1;
    y -=dy*(len-100)/len*0.1;
  }
但剛剛的做法沒辦法像彈簧一樣，只能彈回到原本位置，因此我們用牛頓講過的定理，微積分:位置=>速度=>加速度(力)，簡單來講就是使用微積分的概念，加法和減法操作這三項，再利用彈簧方程式F=-Kx。
float x=200, y=150;
float vx=0, vy=0;
if(!mousePressed)
  {
    float dx=x-100,dy=y-150;
    float len=sqrt(dx*dx+dy*dy);
    vx -=dx*(len-100)/len*0.001;
    vy -=dy*(len-100)/len*0.001;
    x +=vx;
    y +=vy;
  }
但有一個bug，必須在拖曳滑鼠的函式裡加入vx=0,vy=0;，不然再拖曳的時候數值會有錯誤，必須歸零，拉動時不能算速度。

接下來我們可以透過這個算法做出另一個遊戲，滑鼠在哪你畫出的圖案就會跟到哪，類似逗貓的遊戲。
一開始也是要先建設畫面的尺寸，一樣要有兩個變數，畫出全白的長方形，再宣告兩個變數，這變數就是滑鼠移到哪這數值就會有所變化，至於後面乘上的0.1就是你圖案跟到滑鼠的速度，假設你0.1太快就可以設0.01、0.001以此類推就能設置數值讓你的速度有所改變。