img-blur-part
v2.0.7
Published
图片模糊
Downloads
3
Maintainers
Readme
js实现图片模糊
安装
<script src = "https://cdn.jsdelivr.net/npm/[email protected]/dist/index.min.js"></script>
使用
< script src = "https://cdn.jsdelivr.net/npm/[email protected]/dist/index.min.js" > </script>
<script>
imgBlur("../example2.jpg",10, 0, 0, 100, 100, false).then((r) => {
console.log(r);
})
</script>
参数说明
- 入参说明
imgBlur(src, blurNO, sx, sy, width, height, gauss).then((r) => {
console.log(r);
})
| 参数 | 参数类型 |默认值 | 参数说明 | ---- | ---- |---- |---- | | src | string | / |图片地址(一个可以读取到图片的地址,可为网络地址) | | blurNO | number |10 | 模糊度(0-100) | | sx | number | 0 |模糊区域左上角x坐标 | | sy | number | 0 |模糊区域左上角y坐标 | | width | number | 100 |模糊区域宽度 | | height | number | 100 |模糊区域高度 | | gauss | boolean |fasle | 是否启用高斯模糊算法 |
- 反参说明
返回一个pomise实例, 可采用pomise.then(), 获取到处理后的图片base64数据。
效果
更多信息
实现背景和原理:https://www.zhangxinxu.com/wordpress/?p=10131 demo效果体验: https://www.zhangxinxu.com/study/202109/image-local-gaussian-blur-demo.php
版权说明
- 该项目参考了 张鑫旭 / 图像局部高斯模糊。
- 该项目采用了MIT协议