Skip to content

pmkroeker/rasterize-svg

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

24 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

rasterize-svg

Rasterize SVG Elements for Download as PNG

npm

I needed an easy way to download SVG images created in D3 as PNG. I found that Mike Bostock made an Observable Notebook which solved the exact problem. the only issue was that some of the ways Observable handles DOM manipulation is not directly compatible with the browser. I modified the original code to be browser compatible.

Methods

rasterize-svg exports a default function which returns a promise once the file has been saved.

import saveSvg from 'rasterize-svg'

const svgNode = document.querySelector('#mySVG') as SVGElement;
saveSvg(svgNode, 'mySVG.png')
  .then(() => {
    // file saved
  });