功能介紹
本系統是基於fabric.js實現的canvas版圖片,文字編輯器,支援對圖片的放大,縮小,旋轉,鏡面翻轉,拖動,顯示/隱藏圖層,刪除圖層,替換圖層等操作,對文字支援修改文字內容,顏色,字型,加粗,斜體,下劃線,背景色等,同時支援圖片已有的操作,拖動圖層有輔助線功能,可對畫布做放大縮小功能,多操作可撤銷/回退功能,可直接匯出圖片,ps基本操作都已支援,歡迎star.
專案地址： https://github.com/Jeff-Bee/onLinePS.git
功能預覽圖
目錄結構
fabric.js相關
fabric 文件地址 http://fabricjs.com/ 由於中文資料很少,使用過程中也遇到了很多問題,找了好多資料總算是把功能都實現了,如果有在使用這個的小夥伴有什麼問題可以找我溝通.首先需要熟悉canvas的基礎,然後在去使用這個庫會很容易上手.
寫在最後
這個是專案中做的功能,由於過程比較坎坷,fabric.js庫很強大,但是中文資料很少,導致解決問題的時候花費了很多功夫,所以摘出來供需要的人使用,由於有些東西需要後端配合,所以把一部分功能砍掉了,所有程式碼中有一些冗餘程式碼,大家有需要那些功能的也可以宅後臺配合把這些功能也做起來,前端的邏輯都已經實現了.
原文地址 https://juejin.im/post/5d400732e51d45620c1c5337