文章詳情頁
javascript - 將圖片拖進(jìn)canvas
瀏覽:199日期:2022-11-18 18:13:56
問題描述
哪位大神幫忙看看,這個效果,可以把右面的圖片拖進(jìn)canvas,還能進(jìn)行編輯,是怎么實(shí)現(xiàn)的,能不能具體講一下,急
問題解答
回答1:拖進(jìn)去,看看drag and drop API就好了;
關(guān)于編輯圖片,看了下這個站點(diǎn),所謂“畫布”也不是canvas,就是普通的p層。其實(shí)和我自己實(shí)現(xiàn)的一個簡單的圖片編輯器差不多。思路是:
操作的目標(biāo)是圖片(img)
每一種操作都需要被記錄下來,比如放大,旋轉(zhuǎn)等
如果輸出一張圖片的話,就將上面所有img按照順序,執(zhí)行操作動畫,繪制到canvas上,就可以保存圖片了
如果輸出HTML,將上面所有img的每個操作對應(yīng)成CSS的樣式就好了
回答2:拖放的話 你用拖放api 就是,里面有針對 目標(biāo)對象 和源對象的事件處理,但是我不明白 你說的編輯 是什么意思
標(biāo)簽:
JavaScript
上一條:javascript - 關(guān)于input="file",重復(fù)選擇同一文件時不觸發(fā)change事件的問題下一條:javascript - Html5做移到端定位,獲取授權(quán)拒絕了怎么辦?
相關(guān)文章:
1. golang - 用IDE看docker源碼時的小問題2. docker api 開發(fā)的端口怎么獲取?3. 在windows下安裝docker Toolbox 啟動Docker Quickstart Terminal 失敗!4. docker容器呢SSH為什么連不通呢?5. docker - 各位電腦上有多少個容器啊?容器一多,自己都搞混了,咋辦呢?6. docker網(wǎng)絡(luò)端口映射,沒有方便點(diǎn)的操作方法么?7. html5 - 百度Ueditor代碼高亮和代碼段滾動條沖突是怎么回事?8. eclipse - 如何解決no atk-wrapper in java.library.path9. javascript - vue2.0中使用vue2-dropzone的demo,vue2-dropzone的github網(wǎng)址是什么??百度不到。10. angular.js - react的redux和vue的vuex,angular呢
排行榜

熱門標(biāo)簽