Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/f1lt3r/svg-to-dataurl
😹 convert SVGs to DataURLs
https://github.com/f1lt3r/svg-to-dataurl
Last synced: 9 days ago
JSON representation
😹 convert SVGs to DataURLs
- Host: GitHub
- URL: https://github.com/f1lt3r/svg-to-dataurl
- Owner: F1LT3R
- License: mit
- Created: 2018-04-10T20:24:44.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2022-02-23T06:53:58.000Z (over 2 years ago)
- Last Synced: 2024-10-11T20:23:08.129Z (25 days ago)
- Language: JavaScript
- Size: 92.8 KB
- Stars: 5
- Watchers: 3
- Forks: 4
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# svg-to-dataurl
> 😹 convert SVGs to DataURLs
[![Build Status](https://travis-ci.org/F1LT3R/svg-to-dataurl.svg?branch=master)](https://travis-ci.org/F1LT3R/svg-to-dataurl)
[![Coverage Status](https://coveralls.io/repos/github/F1LT3R/svg-to-dataurl/badge.svg?branch=master)](https://coveralls.io/github/F1LT3R/svg-to-dataurl?branch=master)
[![NPM Version](https://img.shields.io/npm/v/svg-to-dataurl.svg)](https://www.npmjs.com/package/svg-to-dataurl)
[![XO code style](https://img.shields.io/badge/code_style-XO-5ed9c7.svg)](https://github.com/sindresorhus/xo)## Install
```
$ yarn add svg-to-dataurl
```## Usage
Where `svgStr` is a string of SVG content, like this:
```xml
```
You can convert the string to a DataURL with `svgToDataURL()`:
```js
const svgToDataURL = require('svg-to-dataurl')
const dataUrl = svgToDataURL(svgStr)console.log(dataUrl)
// data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2240%22%20stroke%3D%22black%22%20stroke-width%3D%223%22%20fill%3D%22red%22%20%2F%3E%3C%2Fsvg%3E
```## Visual Confirmation
You can test the string works by pasting the output into the address bar of your web browser:
![Browser Example](browser-example.png)