文章詳情頁(yè)
javascript - 求助canvas繪制半透明的馬賽克？
瀏覽：324日期：2022-11-24 18:24:34
問題描述
我的需求是提供給用戶使用鼠標(biāo)給上傳的證件涂抹馬賽克，我的思路是給canvas綁定鼠標(biāo)事件，沿著用戶的鼠標(biāo)按壓路徑，將一張半透明的png不停的繪制到證件上，現(xiàn)在我不想用半透明的Png疊加，想直接用canvas生成馬賽克，求皇軍帶路！
問題解答
回答1：算法應(yīng)該并不難：
將 canvas 區(qū)域區(qū)分為形如 100x100 的網(wǎng)格
每次鼠標(biāo)事件，判斷鼠標(biāo)位于哪個(gè)網(wǎng)格內(nèi)
將該網(wǎng)格直接 fillRect 繪制為網(wǎng)格內(nèi)的平均顏色（網(wǎng)格內(nèi)全部點(diǎn)的 rgb 取平均，或直接取網(wǎng)格內(nèi)某一點(diǎn)顏色）
這就實(shí)現(xiàn)了疊加馬賽克的基本算法。
標(biāo)簽：
JavaScript
相關(guān)文章：
1. javascript - immutable配合react提升性能？2. 如何設(shè)置一個(gè)無限循環(huán)并打破它。（Java線程）3. python小白 自學(xué)看書遇到看不懂的地方4. javascript - sublime快鍵鍵問題5. macos - 如何徹底刪除mac自帶的apache和php6. docker 17.03 怎么配置 registry mirror ?7. shell - mysql更新錯(cuò)誤8. DADB.class.php文件的代碼怎么寫9. php對(duì)mysql提取數(shù)據(jù)那種速度更快10. 實(shí)現(xiàn)bing搜索工具urlAPI提交
排行榜
熱門標(biāo)簽
網(wǎng)公網(wǎng)安備