行星環繞效果展示（未做gif圖，真實結果是會自動環繞）
原理說明
繪製乙個簡易的行星環繞圖，主要使用到canvas中的translate函式，用於將畫布原點調整到合適位置；以及rotate函式，讓行星旋轉乙個角度；最後在使用到requestanimationframe函式，令其不間斷的環繞。
為了美化，還是用到圓形顏色漸變createradialgradient函式，在**中由對其引數的詳細說明。
遇到的問題
繪製影象時，首先需要對其各畫布原點進行分析，否者容易發生影象錯位現象，後就是執行的角度設定，執行時，發現如果僅僅只是設定getseconds函式是無法讓影象執行流暢的，再使用getmilliseconds函式獲取毫秒數後，能夠使影象執行變得流暢。
原始碼展示
>
>
charset
="utf-8"
>
>
行星環繞title
>
head
>
>
style
="text-align
: center;
">
"mycanvas"
width
="800"
height
="800"
style
="border
: 1px solid #fff123
">
canvas
>
div>
HTML5 canvas 繪製圓形
canvas繪製圓形的思路 1 建立路徑 beginpath 2 建立圓形的路徑 3 關閉路徑 closepath 路徑不關閉也能繪製出圖形 4 設定繪製樣式。建立圓形路徑時需要用到物件的arc方法，方法定義如 arc x,y,radius,startangle,endangle,countercl...
HTML5 canvas擦除無效
部分安卓手機上會出現canvas內圖表重疊，並且清除無效，屬於偶現缺陷，非常難以確定其產生原因，比如下圖這個樣子，第一次繪製的圖形沒有擦除，導致第二次繪製時出現重影 初步考慮為裝置自身問題，引起canvasapi的context.clearrect執行無效。在經過一些嘗試之後，發現在每次擦除 cle...
HTML5canvas時鐘例項
直接放 不太好，還是簡單說說運用到的canvas知識 1 canvas 元素用於在網頁上繪製圖形。id c width 1000 height 400 canvas 2 canvas2d環境下繪製 var ogc oc.getcontext 2d 3 我要開始繪製路徑啦 ogc.begin path...