使用 getContext() 方法加載 Context2D 圖形庫：
創(chuàng)建畫布后查乒，需要做的就是建立一個繪圖環(huán)境肴捉，Context2D 是一個豐富的圖形函數(shù)庫便脊，通過它可以高效靈活的控制 canvas 圖像
javascript 代碼
var cvs = document.getElementById("cvs"); // cvs 是 canvas 標(biāo)簽的 id
var pro = cvs.getContext("2d"); // 加載 Context2D 庫搬瑰，創(chuàng)建 canvas 環(huán)境變量
其中臣咖，變量 pro 為實例化的 Context2D 對象涩金。
Context2D 對象有一些基本的屬性和方法谱醇，下面列出幾個基本方法和一個例子：
方法：
【1】beginPath() // 開始一個新路徑。通過此方法聲明一條線段或曲線的開始步做。
【2】moveTo(x, y) // 相當(dāng)于繪畫的 “落筆”副渴， 將畫筆聚焦到參數(shù)聲明的坐標(biāo)上
【3】lineTo(x, y) // 從 moveTo 的坐標(biāo) 到 lineTo 的坐標(biāo)添加一條直線路徑
【4】quadraticCurveTo() // 同上，添加一條 “貝塞爾曲線”路徑
【5】stroke() // 沿添加的路徑繪制直線或曲線
【6】closePath() // 關(guān)閉路徑全度，結(jié)束路徑繪制
屬性：
【1】 globalAlpha 設(shè)置畫布的透明度煮剧，0.0 到 1.0 之間
【2】 strokeStyle 主要用來設(shè)置線性元素的顏色
javascript 代碼
pro.beginPath();
pro.moveTo(20,0);
pro.quadraticCurveTo(20, 50, 70, 80);
pro.strokeStyle = "red";
pro.globalAlpha = 0.8;
pro.stroke();
pro.closePath()
繪制一條曲線
這就是一個完整的 canvas 繪制過程，通過動態(tài)調(diào)整Context2D方法參數(shù)将鸵，可以做出絢麗的特效勉盅。
上一篇 canvas 標(biāo)簽
下一篇 弧形
