畫布是一個(gè)矩形區(qū)域,您可以控制其每一像素。
canvas 擁有多種繪制路徑、矩形、圓形、字符以及添加圖像的方法。
不過,<canvas> 元素本身并沒有繪制能力(它僅僅是圖形的容器) - 您必須使用腳本來完成實(shí)際的繪圖任務(wù)。
getContext() 方法可返回一個(gè)對象,該對象提供了用于在畫布上繪圖的方法和屬性。
基本知識(shí)
var context =canvas.getContext("2d");
也許這個(gè)2d勾起了大家的無限遐想,但是很遺憾的告訴你html5還只是個(gè)少女,不提供3d服務(wù)。
canvas元素繪制圖像的時(shí)候有兩種方法,分別是
context.fill()//填充
context.stroke()//繪制邊框
style:在進(jìn)行圖形繪制前,要設(shè)置好繪圖的樣式
context.fillStyle//填充的樣式
context.strokeStyle//邊框樣式
context.lineWidth//圖形邊框?qū)挾?br />
顏色的表示方式:
直接用顏色名稱:"red" "green" "blue"
十六進(jìn)制顏色值: "#EEEEFF"
rgb(1-255,1-255,1-255)
rgba(1-255,1-255,1-255,透明度)
和GDI是如此的相像,所以用過GDI的朋友應(yīng)該很快就能上手