問題描述

我的需求是提供給用戶使用鼠標給上傳的證件涂抹馬賽克，我的思路是給canvas綁定鼠標事件，沿著用戶的鼠標按壓路徑，將一張半透明的png不停的繪制到證件上，現在我不想用半透明的Png疊加，想直接用canvas生成馬賽克，求皇軍帶路！

問題解答

算法應該并不難：

將 canvas 區域區分為形如 100x100 的網格

每次鼠標事件，判斷鼠標位于哪個網格內

將該網格直接 fillRect 繪制為網格內的平均顏色（網格內全部點的 rgb 取平均，或直接取網格內某一點顏色）

這就實現了疊加馬賽克的基本算法。