https://github.com/firstandthird/svg-injector
Loads and caches an SVG file and injects it into the DOM
https://github.com/firstandthird/svg-injector
svg-injector svg-sprites
Last synced: 7 months ago
JSON representation
Loads and caches an SVG file and injects it into the DOM
- Host: GitHub
- URL: https://github.com/firstandthird/svg-injector
- Owner: firstandthird
- License: mit
- Created: 2018-04-11T06:30:02.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2020-05-18T10:52:22.000Z (over 5 years ago)
- Last Synced: 2025-03-01T23:32:25.586Z (7 months ago)
- Topics: svg-injector, svg-sprites
- Language: JavaScript
- Homepage:
- Size: 118 KB
- Stars: 0
- Watchers: 4
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# SVG Injector  [](https://travis-ci.org/firstandthird/svg-injector)
Loads and caches an SVG file and injects it into the DOM.
## Installation
```sh
npm install @firstandthird/svg-injector
```
## Usage
In your project import the library:
```javascript
import { loadSVG, injectSVG } from '@firstandthird/svg-injector'
```
The `injectSVG` method will be automatically called once the `DOMContentLoaded` event is fired using `window.svgLocation` as parameter.
## Events
Custom events are fired on injection.
| Event | Where | When |
|-------------------|---------|------------------------------|
| `svgicons:loaded` | `body` | SVG is injected into the DOM |
## API
- [loadSVG](#loadsvgurl-callback)
- [injectSVG](#injectsvgurl)
### loadSVG(url, [callback])
Loads an SVG file.
#### Parameters
`url` - {string} - A valid URL to the SVG file.
`[callback]` {function} - Callback function called once the SVG is loaded.
#### Example
```javascript
loadSVG('image.svg', (svg) => {
console.log(svg); // prints the SVG content
});
```
### injectSVG(url)
Injects an SVG into the DOM. Calls [loadSVG](#loadsvgurl-callback).
#### Parameters
`url` - {string} - A valid URL to the SVG file. Fires a [`svgicons:loaded`](#events) event when completed.
#### Example
```javascript
injectSVG('image.svg');
```