StackBlur.js

最新推荐文章于 2022-11-02 14:45:44 发布

anhuang1896

最新推荐文章于 2022-11-02 14:45:44 发布

阅读量477

点赞数

文章标签： git php

原文链接：http://www.cnblogs.com/qianduanjingying/p/5843025.html

版权

StackBlur.js 是 Mario Klingemann 创建的一个快速的、接近高斯模糊的效果库。

要使用独立版本，需要从 Github 上下载 latest zip，或者 clone 库。

git clone git@github.com:flozz/threadify.git

然后在你的 HTML 页面中引入dist/stackblur.js或者dist/stackblur.min.js文件。

<script src="StackBlur/dist/stackblur.js"></script>

使用 NPM 包管理器，安装包：

npm install --save stackblur-canvas

在你需要的地方引用

var StackBlur = require("stackblur-canvas");

要使用 Bower package，安装包：

bower install stackblur-canvas

然后在你的 HTML 页面中引入dist/stackblur.js或者dist/stackblur.min.js文件：

<script src="bower_components/stackblur-canvas/dist/stackblur.js"></script>

下面是针对不同的源（图片或者 Canvas 等）进行 StackBlur 的调用。

图像作为源:

StackBlur.image(sourceImage, targetCanvas, radius, blurAlphaChannel);

RGBA Canvas 作为源:

StackBlur.canvasRGBA(targetCanvas, top_x, top_y, width, height, radius);

RGB Canvas 作为源:

StackBlur.canvasRGB(targetCanvas, top_x, top_y, width, height, radius);

RGBA ImageData 作为源:

StackBlur.imageDataRGBA(imageData, top_x, top_y, width, height, radius);

RGB ImageData 作为源:

StackBlur.imageDataRGB(imageData, top_x, top_y, width, height, radius);

该库是使用 Grunt 构建的。如果你想修改src/目录下的内容，使用下面的命令来重新构建文件到dist/目录下：

grunt

转载于:https://www.cnblogs.com/qianduanjingying/p/5843025.html

关注