轉換 Image為 Canvas
要把圖片轉換為Canvas(畫板，畫布),可以使用canvas元素 context 的drawImage方法：

1. // 把image 轉換為 canvas物件
2. function convertImageToCanvas(image) {  
3.     // 建立canvas DOM元素，並設定其寬高和圖片一樣 
4.     var canvas = document.createElement("canvas");  
5.     canvas.width = image.width;  
6.     canvas.height = image.height;  
7.     // 座標(0,0) 表示從此處開始繪製，相當於偏移。
8.     canvas.getContext("2d").drawImage(image, 0, 0);  
9.     return canvas;  
10. }  

1. // 從 canvas 提取圖片 image
2. function convertCanvasToImage(canvas) {  
3.     //新Image物件，可以理解為DOM
4.     var image = new Image();  
5.     // canvas.toDataURL 返回的是一串Base64編碼的URL，當然,瀏覽器自己肯定支援
6.     // 指定格式 PNG
7.     image.src = canvas.toDataURL("image/png");  
8.     return image;  
9. }