为了给证件照加水印，造了个加水印的轮子

[ruter8]

因为想要方便自己在需要的时候可以给证件加上水印，于是乎造了个加水印的轮子，纯前端实现（ Vue ），不进行图片上传。

使用了 watermark.js 进行水印的处理，Mint UI 提供组件。

具体实现比较粗糙，感兴趣的可以看看，传送门 >>> ruter/watermarker

Preview

可以在这里体验 >>> demo

[ichanne]

不错不错，最好能加隐藏水印，和钉钉截图一样

[virusdefender]

微信小程序有一个叫 水印小助手 的就是做这个事情的，手机上更方便一些

[thankfish]

666666

[ruter8]

@ichanne 这个就是为了方便自己给证件加水印的拉，隐藏水印这种事交给专业的工具去做比较好

@virusdefender 微信直接打开链接一样可以用，问题不大

[nameryan]

实现不难，倒是从使用场景考虑，一般需要加水印的是证件照
而通过上传图片来加水印这种方式，对于证件照这种还是比较敏感的，所以如果能有效的通过本地处理的方式会更受欢迎。

[ruter8]

@nameryan 这个没有进行任何上传操作的，代码里可以看到都是在本地环境进行的处理，可以断网使用

[nameryan]

@ruter8 那我就信了：） 收藏了

[zacharyjia]

透明度反啦，应该是越往右拉透明度越大，越不容易看清呀

[ruter8]

@zacharyjia 从左到右是从 0 到 1，透明度数值越低越透明，1 表示不透明

[zacharyjia]

@ruter8 正常的想法不应该是透明度越高越透明吗= =

[codehz]

能实时预览吗（

[ruter8]

@zacharyjia 唔…一直都是接触的 0 是透明 1 是不透明的

@codehz 可以自己改，每次有变化调用一次渲染的方法就好了

[xiaozizayang]

赞！