活動地址：http://html5.group.iteye.com/group/topic/28234
嚴格來說這片博文不應該叫《HTML5 Canvas實現貪喫蛇》。因爲這裏除了向給大家展示用Canvas+javascript實現snake外，更重要的是我在寫出snake之前，對Canvas學習過程中整理的筆記。因此這篇博文的內容有兩個重點：
- 提供關於Canvas的相關學習文檔
- 提供基於上述文檔後的實例snake
Canvas學習文檔是參考https://developer.mozilla.org/cn/Canvas_tutorial提供的文檔，但在學習過程中添加了自己的理解，並提供了相應的實例，以便直觀的理解。
這裏大概提下自己在學習Canvas中覺得重要的地方：
1、Canvas座標系的所有方法
如果你想用Canvas繪製遊戲場景，那麼你必須要熟練掌握Canvas座標系的相關知識。比如：如何移動座標原點，如何縮放座標比例以及如何進行座標系旋轉。因爲使用Canvas製作移動動畫時，其實可以認爲是Canvas座標原點的移動，也就是畫可以不動，而是背景在移動；畫面不用旋轉，而是畫布在旋轉。
2、Canvas狀態的保存與恢復
這裏面涉及到兩個方法save()和restore()，用來保存Canvas狀態及回覆Canvas狀態到上一個狀態。當需要在Canvas上繪製新的圖形時，一般需要首先調用save()方法將繪製前Canvas上已經設置了的狀態保存下，避免本次繪製時覆蓋基礎狀態。而在繪製完成後調用restore()方法恢復Canvas狀態。
3、Canvas基本動畫
掌握在Canvas上動畫的基本步驟
至於其他的什麼繪製圖形之類的，大家照着文檔創建就行了。文檔請查看附加，這裏我已經制作成PDF格式的了。
Canvas貪喫蛇的實現請查看源文件。這裏不再贅述，代碼中有具體的註釋。同時在demo中我提供了Mozilla中的鐘表實例，並對其中的代碼做了註解，大家可以看看學習下。
注：demo中的snake頭部繪製成了喫豆子游戲的類似樣子，在demo中該圖形只是用來練習Canvas的相關函數，而不作爲商業使用，特此聲明
相關截圖請查看附件。
最後大家有興趣可以看下我以前用div + javascript寫的貪喫蛇和俄羅斯方塊，比較下與使用html5 canvas的區別。