求助canvas绘制半透明的马赛克?

我的需求是提供给用户使用鼠标给上传的证件涂抹马赛克,我的思路是给canvas绑定鼠标事件,沿着用户的鼠标按压路径,将一张半透明的png不停的绘制到证件上,现在我不想用半透明的Png叠加,想直接用canvas生成马赛克,求皇军带路!

阅读 3.7k
1 个回答

算法应该并不难:

  1. 将 canvas 区域区分为形如 100x100 的网格

  2. 每次鼠标事件,判断鼠标位于哪个网格内

  3. 将该网格直接 fillRect 绘制为网格内的平均颜色(网格内全部点的 rgb 取平均,或直接取网格内某一点颜色)

这就实现了叠加马赛克的基本算法。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题