Skip to main content

canvg

NPM version Dependencies status Build status Coverage status

JavaScript SVG parser and renderer on Canvas. It takes the URL to the SVG file or the text of the SVG file, parses it in JavaScript and renders the result on Canvas. It also can be used to rasterize SVG images.

Quickstart​

Install this library using your favorite package manager:

pnpm add canvg

Then, just import Canvg and use it:

import { Canvg } from 'canvg';

let v = null;

window.onload = async () => {
const canvas = document.querySelector('canvas');
const ctx = canvas.getContext('2d');

v = await Canvg.from(ctx, './svgs/1.svg');

// Start SVG rendering with animations and mouse handling.
v.start();
};

window.onbeforeunload = () => {
v.stop();
};

Examples​

Please see live examples.

Getting Help​

Need help? Ask your question on Stack Overflow.

If you've encountered an issue, please file it on GitHub.