HTML5技術為我們帶來的圖像處理
HTML5技術可謂現(xiàn)在炙手可熱的流行新技術，但是HTML5到底能夠做什么呢？那就來看看國內(nèi)的Web技術團隊 AlloyTeam 為我們做的這個HTML5前線的技術展示吧！之前很多HTML5的新聞都是浮于表面的講一些概括的、概念性的東西，很少具體的技術展示，這一次將讓你真切的感受HTML5所帶來的技術革新，讓你可以立刻在線體驗HTML5圖像技術為你帶來的便利。
很多人都需要處理照片，比如把一張照片轉換成素描風格，以往我們可能需要使用PhotoShop等客戶端圖像處理工具，但是，有了HTML5之后，這件小事就不需要啟動任何客戶端程序了，只要將照片輕輕拖進這個HTML5的WebApp頁面，只需要不到0.01毫秒即可獲得處理后的照片。
原圖：
處理后的圖片：
怎么樣，是不是迫不及待的想體驗一下這神奇的HTML5新技術？那就趕快來給你最親愛的她（不要給你的小三用哦）用HTML5技術來ps一張小清新的素描畫像吧（注意只能用現(xiàn)代瀏覽器（Chrome，F(xiàn)irefox，Opera，Safari等）打開哦，IE9以前的老古董就甭來啦）：
技術實現(xiàn)詳解（內(nèi)含Github開源地址）：http://www.alloyteam.com/2012/07/convert-picture-to-sketch-by-canvas/
圖片處理在線體驗：http://apps.imatlas.com/sketching/
使用指引拖拽一張圖片到畫布區(qū)（就是下面打開的灰色地帶～），然后……就沒有然后啦，因為在0.01秒的時間內(nèi)，照片已經(jīng)處理完畢，點擊download按鈕可以下載生成的圖片。
如果感覺效果不太好，可以改下取樣的半徑（Sample size），為正整數(shù)，最小為1，之后點下action按鈕，生成新的素描圖。
如果你還不明白，下面來看圖說明（點擊圖片可以查看大圖）。
sketching 圖示 HTML5實現(xiàn)的原理就是使用Canvas技術對圖片做一下處理：
去色（黑白化）
復制一份，反相
把復制后的圖層疊加方式設為顏色減淡
高斯模糊
詳細的技術實現(xiàn)可以看這里（內(nèi)含Github開源地址）：http://www.alloyteam.com/2012/07/convert-picture-to-sketch-by-canvas/
【編輯推薦】
