先從簡單的開始
fillrect(x,y,width,height)
fillrect(0,0,500,500)//在座標0,0處加上乙個寬高500的填充矩形
strokerect(x,y,width,height)在座標x,y的位置加上乙個寬,高邊框矩形
但是需要使用linewidth,linejoin,strokestyle,miterlimit設定下面會給出矩形函式
clearrect(x,y,width,height)清除座標x,y的位置寬,高的一塊區域是起完全透明
感覺有點像用ps時候乙個黑色的圖層,拉乙個矩形選框,然後按個delect的感覺一塊透明
然後設定一下填充樣式
context.fillstyle='#000000' //填充顏色完整**context.strokestyle='#ff00ff' //邊框顏色
你的瀏覽器無法使用canvas結果就是這樣乙個
html5canvas基本功能
var canvas document.getelementbyid canvas var cxt canvas.getcontext 2d 畫線 用線畫三角型 cxt.strokestyle red 線作色 cxt.lineto 59,59 線的起點 cxt.lineto 20,20 cxt.li...
HTML5 canvas 繪製圓形
canvas繪製圓形的思路 1 建立路徑 beginpath 2 建立圓形的路徑 3 關閉路徑 closepath 路徑不關閉也能繪製出圖形 4 設定繪製樣式。建立圓形路徑時需要用到物件的arc方法,方法定義如 arc x,y,radius,startangle,endangle,countercl...
HTML5 canvas擦除無效
部分安卓手機上會出現canvas內圖表重疊,並且清除無效,屬於偶現缺陷,非常難以確定其產生原因,比如下圖這個樣子,第一次繪製的圖形沒有擦除,導致第二次繪製時出現重影 初步考慮為裝置自身問題,引起canvasapi的context.clearrect執行無效。在經過一些嘗試之後,發現在每次擦除 cle...