canvas 第五章 數學、物理和運動學習筆記
讓人映像深刻的運動，需要我們不只是簡單的知道如何移動物件，還需要知道怎麼按使用者期望看到的方式去移動它們。這些需要基於數學知識的基本演算法和物理學作用。
基於點和向量的簡單運動提供了乙個基礎，現在可以去建立些例如碰牆彈回和別乙個有點摩擦的混合。之後，我們將回過來講講非直線式運動。例如：圓、螺旋型和複雜的貝塞爾曲線的。我們還將涉及影響運動的重力。最後，我們將以討論緩動和如何使用它來做好基於數學的運動結束本章。
your browser does not support canvas
溫習一下canvas 的基本api
由id得到canvas 物件 thecanvas = document.getelementbyid('canvasone');
context thecanvas.getcontext("2d");
fillstyle 填充樣式 fillrect 填充矩形
strokestyle 勾框樣式 strokerect 只有框的， beginpath 開始 closepath 結束 fill填充
兩點間的移動 線性距離
Canvas學習筆記 動畫環境中的邊界
在動畫中經常要處理邊界問題，比如乙個物體運動到了邊界，要怎麼處理才合適呢？通常有幾種以下幾種方式 這裡的讓物體消失並不是單純的讓物體移動出邊界，而是將物體銷毀，即從陣列中移除。重置物體是指讓物體回到初始的位置繼續執行動畫，這樣就能夠在不銷毀物體或中斷動畫的情況下持續看到動畫效果，也提公升了效能。嘗試...
Canvas學習實踐 一款簡單的動畫遊戲
最近學習了下canvas繪圖。突發奇想就有了下面這款簡單的小遊戲，純屬娛樂 廢話不多說，直接上 doctype html html lang zh head meta charset utf 8 title 小怪獸吃豆豆 title style canvas score title style he...
Canvas學習筆記 動畫中的三角學
示例1，跟隨滑鼠的鍵頭 需要掌握乙個重要的公式，這個方法返回從 x 軸到點 x,y 之間的角度 關鍵 1 function arrow 78 arrow.prototype.draw function context 2930 var canvas document.getelementbyid c...