# svg-blur

> 使用svg生成夸浏览器的高斯模糊图片

Latest version **1.0.1** (published 2018-04-27) · ISC license · 0 weekly downloads

## Install

```sh
npm install svg-blur
pnpm add svg-blur
yarn add svg-blur
bun add svg-blur
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2018-04-27 |
| First published | 2018-04-27 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 6.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Maintainers | go7hic |

## Links

- npm: https://www.npmjs.com/package/svg-blur
- Repository: https://github.com/dyygtfx/svg-blur
- Homepage: https://github.com/dyygtfx/svg-blur#readme
- Issues: https://github.com/dyygtfx/svg-blur/issues
- npm.io page: https://npm.io/package/svg-blur

## Recent versions

- 1.0.1 (latest) — 2018-04-27
- 1.0.0 — 2018-04-27

## README

# svg-blur

使用svg生成夸浏览器的高斯模糊图片

## 使用

```
npm i svg-blur -S
```
```
import Blur from 'svg-blur'

new Blur('#element', {options})

```

eg:

```
const BlurFn = new Blur(document.querySelector('.blur'), {
    url: imgurl || '',
    blurAmount: 25,
    duration: 100, 
    opacity: 1,
    overlayClass: ''
});
```


react 项目的话在 componentDidMount 里面调用。

```
componentDidMount() {
    const BlurFn = new Blur(document.querySelector('.blur'), {
        url: imgurl || '',
        blurAmount: 25,
        duration: 100, 
        opacity: 1,
        overlayClass: ''
    });
}
```

```
<div style={{ height: 354 }} className="blur" />
```

---
_Source: https://npm.io/package/svg-blur · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._