{"id":13671446,"url":"https://github.com/flozz/StackBlur","last_synced_at":"2025-04-27T18:31:16.982Z","repository":{"id":14606884,"uuid":"17324092","full_name":"flozz/StackBlur","owner":"flozz","description":"Fast and almost Gaussian blur","archived":false,"fork":false,"pushed_at":"2024-09-24T08:09:59.000Z","size":1118,"stargazers_count":1272,"open_issues_count":9,"forks_count":123,"subscribers_count":21,"default_branch":"master","last_synced_at":"2024-10-29T15:06:41.482Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/flozz.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGES.md","contributing":null,"funding":null,"license":"LICENSE-MIT.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2014-03-01T20:55:26.000Z","updated_at":"2024-10-13T05:07:15.000Z","dependencies_parsed_at":"2024-11-11T13:15:17.309Z","dependency_job_id":null,"html_url":"https://github.com/flozz/StackBlur","commit_stats":{"total_commits":53,"total_committers":12,"mean_commits":4.416666666666667,"dds":0.6037735849056604,"last_synced_commit":"1b85fe57ae5c2e7beeff157e1f9f7c7a7082f537"},"previous_names":[],"tags_count":14,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/flozz%2FStackBlur","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/flozz%2FStackBlur/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/flozz%2FStackBlur/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/flozz%2FStackBlur/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/flozz","download_url":"https://codeload.github.com/flozz/StackBlur/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251187117,"owners_count":21549586,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-02T09:01:09.860Z","updated_at":"2025-04-27T18:31:16.580Z","avatar_url":"https://github.com/flozz.png","language":"JavaScript","readme":"# StackBlur.js\n\n[![NPM Version](https://img.shields.io/npm/v/stackblur-canvas.svg)][pkg-npm]\n[![License](https://img.shields.io/npm/l/stackblur-canvas.svg)](https://github.com/flozz/StackBlur/blob/master/COPYING)\n\nStackBlur.js is a fast, almost Gaussian blur created by Mario Klingemann.\n\n  * **More informations:** \u003chttp://incubator.quasimondo.com/processing/fast_blur_deluxe.php\u003e\n  * **Algorithm:** \u003chttps://medium.com/better-programming/blurring-image-algorithm-example-in-android-cec81911cd5e\u003e\n  * **Demo:** \u003chttp://www.quasimondo.com/StackBlurForCanvas/StackBlurDemo.html\u003e\n\nOriginal source:\n\n  * \u003chttp://www.quasimondo.com/StackBlurForCanvas/StackBlur.js\u003e\n\n## Getting Started\n\n### Standalone version\n\nTo use the standalone version,\n\ndownload the [latest zip][dl-zip-master] from Github or clone the repository\n\n```\ngit clone git@github.com:flozz/StackBlur.git\n```\n\nand include the `dist/stackblur.js` or `dist/stackblur.min.js` file in your HTML page:\n\n```html\n\u003cscript src=\"StackBlur/dist/stackblur.js\"\u003e\u003c/script\u003e\n```\n\n### Node\n\nTo use the [NPM package][pkg-npm],\n\ninstall the package:\n\n```\nnpm install --save stackblur-canvas\n```\n\nand require it where needed\n\n```js\nconst StackBlur = require('stackblur-canvas');\n```\n\n### Browsers\n\nIf you are only supporting modern browsers, you may use ES6 Modules directly:\n\n```js\nimport * as StackBlur from\n  './node_modules/stackblur-canvas/dist/stackblur-es.min.js';\n```\n\nOr, if you are using Rollup in your own project, use the [node-resolve](https://github.com/rollup/rollup-plugin-node-resolve) plugin,\nand import by just referencing the module:\n\n```js\nimport * as StackBlur from 'stackblur-canvas';\n```\n\n## API\n\nSee also the docs in [docs/jsdoc](./docs/jsdoc/index.html).\n\n**Image as source:**\n\n```js\nStackBlur.image(sourceImage, targetCanvas, radius, blurAlphaChannel);\n```\n\n  * `sourceImage`: the `HTMLImageElement` or its `id`.\n  * `targetCanvas`: the `HTMLCanvasElement` or its `id`.\n  * `radius`: the radius of the blur.\n  * `blurAlphaChannel`: Set it to `true` if you want to blur a RGBA image (optional, default = `false`)\n\n**RGBA Canvas as source:**\n\n```js\nStackBlur.canvasRGBA(targetCanvas, top_x, top_y, width, height, radius);\n```\n\n  * `targetCanvas`: the `HTMLCanvasElement`.\n  * `top_x`: the horizontal coordinate of the top-left corner of the rectangle to blur.\n  * `top_y`: the vertical coordinate of the top-left corner of the rectangle to blur.\n  * `width`: the width of the rectangle to blur.\n  * `height`: the height of the rectangle to blur.\n  * `radius`: the radius of the blur.\n\n**RGB Canvas as source:**\n\n```js\nStackBlur.canvasRGB(targetCanvas, top_x, top_y, width, height, radius);\n```\n\n  * `targetCanvas`: the `HTMLCanvasElement`.\n  * `top_x`: the horizontal coordinate of the top-left corner of the rectangle to blur.\n  * `top_y`: the vertical coordinate of the top-left corner of the rectangle to blur.\n  * `width`: the width of the rectangle to blur.\n  * `height`: the height of the rectangle to blur.\n  * `radius`: the radius of the blur.\n\n**RGBA ImageData as source:**\n\n```js\nStackBlur.imageDataRGBA(imageData, top_x, top_y, width, height, radius);\n```\n\n  * `imageData`: the canvas' `ImageData`.\n  * `top_x`: the horizontal coordinate of the top-left corner of the rectangle to blur.\n  * `top_y`: the vertical coordinate of the top-left corner of the rectangle to blur.\n  * `width`: the width of the rectangle to blur.\n  * `height`: the height of the rectangle to blur.\n  * `radius`: the radius of the blur.\n\n**RGB ImageData as source:**\n\n```js\nStackBlur.imageDataRGB(imageData, top_x, top_y, width, height, radius);\n```\n\n  * `imageData`: the canvas' `ImageData`.\n  * `top_x`: the horizontal coordinate of the top-left corner of the rectangle to blur.\n  * `top_y`: the vertical coordinate of the top-left corner of the rectangle to blur.\n  * `width`: the width of the rectangle to blur.\n  * `height`: the height of the rectangle to blur.\n  * `radius`: the radius of the blur.\n\n\n## Hacking\n\n### Building\n\nThis library is built using [Rollup](https://rollupjs.org/guide/en).\nIf you change something in the `src/` folder, use the following command\nto re-build the files in the `dist/` folder:\n\n`npm run rollup`\n\n\n[dl-zip-master]: https://github.com/flozz/StackBlur/archive/master.zip\n[pkg-npm]: https://www.npmjs.com/package/stackblur-canvas\n[grunt]: http://gruntjs.com/\n","funding_links":[],"categories":["JavaScript","others"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fflozz%2FStackBlur","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fflozz%2FStackBlur","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fflozz%2FStackBlur/lists"}