幾個用于前端canvas圖片查看編輯的js插件

1 tui.image-editor
2 Konva
3 AlloyImage
4 zwibbler
5 canvasPS
6 Photo Editor

1 tui.image-editor

https://nhn.github.io/tui.image-editor/latest/
tui.image-editor： 使用HTML5 Canvas實現的全功能照片圖像編輯器，配有很棒的過濾器。示例：

2 Konva

https://gitee.com/sdsxfjh/konva
https://github.com/konvajs/konva
Konva是一個HTML5 Canvas JavaScript框架，它支持高性能動畫、過渡、節點嵌套、分層、過濾、緩存、桌面和移動應用程序的事件處理等等。
您可以在畫布或舞臺上繪制東西，向它們添加事件監聽器，移動它們，縮放它們，并獨立于其他形狀旋轉它們，以支持高性能動畫，即使您的應用程序使用數千個形狀。

3 AlloyImage

http://alloyteam.github.io/AlloyImage/docs.html#mutiThread
AlloyImage（AI)是一個基于html5技術的JS圖像處理庫，集成了一些方便快捷的圖像處理API，您可以將它引用到您的網頁中，結合css3等技術，做出一些之前無法做到的優美效果，或者，提供一個用JS編寫的在線圖像處理工具等。
設計理念
簡單代碼做復雜事情
1.接口調用簡單
2.提供進一步封裝的組合效果方便調用
3.基于AI編寫的alloyPhoto，完整展示AI的能力與接口，以及調用方法Demo展示，更易于學習
特點
1.圖層功能，提供圖層的添加，刪除，交換圖層順序等功能，且包含與PS相對應的17種圖層混合模式
2.圖像的基本調節功能，包括亮度、對比度，色相、飽和度、明度調節
3.多種濾鏡功能，去色、反相、高斯模糊、銳化、浮雕效果、查找邊緣、馬賽克、腐蝕等
4.處理后文件的保存，處理完成之后，可以將文件輸出為base64形式間接使用和保存
5.高級組合效果，如素描，lomo，復古，素描等復合效果 如一個素描效果的實現。示例：

4 zwibbler

https://zwibbler.com/docs/#introduction
zwibbler（特別提示這玩意兒不是開源的，不過源碼可以在瀏覽器開發者工具中找到） 是一個外國人開發的一款在線畫板工具。
1、官網 zwibbler.com (里面是對工具的簡介，一些 demo，一些解決方案，開發者郵箱地址等)
2、Demo zwibbler.com/demo (一個完整的demo)
3、Api zwibbler.com/docs (非常詳細的英文文檔)
zwibbler 是用原生的js結合html5開發的，支持電腦和手機端，使用非常簡單，而且開發者對zwibbler的更新非常頻繁。

5 canvasPS

https://gitee.com/jhpw/canvasPS
基于canvas 圖片編輯器，裁剪，摳圖，簡單調色常用功能等等 功能列表：
1 -多邊形選區
2 -拾色器
3 -畫筆快速刪除
4 -裁剪工具
5 -鉛筆
6 -刷子
7 -畫布移動縮放
8 -橡皮擦
9 -RGBA顏色調節器
10 -填充工具
11 -多圖片格式保存
12 -支持文件拖放
13 -顏色選擇工具

6 Photo Editor

http://alloyteam.github.io/AlloyImage/docs.html#mutiThread
Photo Editor 一個簡單的照片編輯器，具有移動、剪切、縮放、旋轉、翻轉等功能的實現

總結

以上是生活随笔為你收集整理的几个用于前端canvas图片查看编辑的js插件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。