使用 getContext() 方法加載 Context2D 圖形庫：
創建畫布后，需要做的就是建立一個繪圖環境，Context2D 是一個豐富的圖形函數庫，通過它可以高效靈活的控制 canvas 圖像
javascript 代碼
var cvs = document.getElementById("cvs"); // cvs 是 canvas 標簽的 id
var pro = cvs.getContext("2d"); // 加載 Context2D 庫，創建 canvas 環境變量
其中，變量 pro 為實例化的 Context2D 對象。
Context2D 對象有一些基本的屬性和方法，下面列出幾個基本方法和一個例子：
方法：
【1】beginPath() // 開始一個新路徑。通過此方法聲明一條線段或曲線的開始。
【2】moveTo(x, y) // 相當于繪畫的 “落筆”， 將畫筆聚焦到參數聲明的坐標上
【3】lineTo(x, y) // 從 moveTo 的坐標 到 lineTo 的坐標添加一條直線路徑
【4】quadraticCurveTo() // 同上，添加一條 “貝塞爾曲線”路徑
【5】stroke() // 沿添加的路徑繪制直線或曲線
【6】closePath() // 關閉路徑，結束路徑繪制
屬性：
【1】 globalAlpha 設置畫布的透明度，0.0 到 1.0 之間
【2】 strokeStyle 主要用來設置線性元素的顏色
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 繪制過程，通過動態調整Context2D方法參數，可以做出絢麗的特效。
