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();
};

supported by Cube

Examples

Please see live examples.

Getting Help

Need help? Ask your question on Slack or Stack Overflow.

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