SVGSaver Reboot

Download an SVG element as an SVG or PNG file, including CSS defined styles.

[Fork] A modern, updated, typescript version of the popular Javascript library Hypercubed/svgsaver.

NOTE: THIS LIBRARY IS NOT READY FOR PRODUCTION AND IS ONLY USED INTERNALLY IN rainbow-board.

Table of Contents

• Documentation.
• What is Different From Original.
• Features (Original)
• Installation
• Example
• Acknowledgements
• License

What is Different From Original

• New modern API suitable for environments like Electron. Documentation here.
• Completely rewritten in typescript with typings and JSDoc.
• Callbacks converted to Promises/async_await.
• Old JS syntax such as var replaced with newer alternatives.
• REMOVED: Support for older browsers. Latest APIs are used instead.

Features (Original)

• Download <svg> by element object.
• Download as SVG or PNG file.
• Copies SVG element styles as rendered in the browser, including styles defined in CSS style sheets.
• Copies only SVG relevant and non-default styles. See here.
• Computed styles are in-lined for maximum compatibility.

Installation

The package is available on NPM under the name svgsaver-reboot

Example

import { SVGSaver } from 'svgsaver-reboot';
const svg = document.querySelector('#mysvg');
const saver = new SVGSaver(svg); // Can convert to PNG, dataURL, Blob or save directly.
saver.saveAsSVG(svg);

Acknowledgments

Forked from the popular library Hypercubed/svgsaver.

Based on previous work on Hypercubed/angular-downloadsvg-directive. Some portions of this code inspired by raw and moagrius/copycss.

License

MIT License