context.drawImage(image,dx,dy);????????????????? d指destination,s指source
context.drawImage(image,dx,dy,dw,dh)：dh和dw會(huì)默認(rèn)地幫我們進(jìn)行圖片的縮放處理析藕，也就是在整個(gè)canvas的dx,dy這個(gè)位置以dw，dh這樣的寬和高來繪制image這樣一個(gè)圖片锣笨；
context.drawImage(image,sx,sy,sw,sh,dx,dy,dw,dh)
實(shí)例演練筆記：放大和縮小圖像的方法框产，超過畫布的裁剪，在畫布內(nèi)的顯示
綠色是放大的圖片悬荣，藍(lán)色 是canvas大小菠秒，需要將圖片放在中間，要算從圖片的哪個(gè)位置開始截圖氯迂，因此需要知道sx,sy：圖片的大小的一半減去畫布的一半的大小践叠。
Canvas與鼠標(biāo)交互
onmousedown,onmouseup,onmouseout,onmousemove
e.preventDefault()，阻止默認(rèn)地事件響應(yīng)
綠色的背景是整個(gè)Web頁面囚戚，藍(lán)色是canvas畫布
獲取圖像像素
imageData = context.getImageData(x,y,w,h)
ImageData對(duì)象：width,height,data(data中存儲(chǔ)了這個(gè)區(qū)域圖像的像素信息)
putImageData:將已知的imageData放回Canvas畫布中
imageData中的data是將圖片的所有像素轉(zhuǎn)換為一維的數(shù)組（將一個(gè)二維空間上的數(shù)據(jù)轉(zhuǎn)換為一維數(shù)組）酵熙；如圖所示轧简，在這個(gè)像素里驰坊，四個(gè)元素一組：
灰度濾鏡計(jì)算方式：var grey = r*0.3+g*0.59+b*0.11;
黑白濾鏡計(jì)算方式：在灰度濾鏡的基礎(chǔ)上，if (grey>255/2) {v=255;}else{v=0;}
反色濾鏡：255減去每個(gè)r,g,b哮独；
模糊濾鏡：http://www.imooc.com/video/9287
馬賽克濾鏡：http://www.imooc.com/video/9287
創(chuàng)建imageData:imageData = context.createImageData(w,h);
