How to download your visualization as a PNG
In this article, we'll explain how to download your chart, map, or table as a static image, e.g. to print it or embed it in a presentation. This feature is free for all Datawrapper users.
The image format that works best for graphics and can be imported/uploaded to most other tools (e.g. Photoshop, Keynote, Powerpoint, Google Docs, etc.) is PNG – short for Portable Network Graphics. PNG's are also a great option if your CMS doesn't allow HTML embeds. PNGs have the file extension .png.
Note that PNG is a raster-based image format, not a vector-based on: An image saved as PNG will become pixelated when you scale it up after exporting it from Datawrapper. Make sure to export the PNG from Datawrapper in the format you'll need it, not smaller. Or use our PDF export for a vector export that can be scaled up indefinitely. You can learn how to do so here.
How to choose the PNG export
To choose the PNG export, you'll need to go to step 4: Publish & Embed. Click on the button that says "PNG", and you'll see options appearing below it.
Options when downloading your chart as PNG
When you click on the PNG button, you'll see four settings.
1. Format
The width of your format is pre-filled with the width of your chart as you've defined in Step 3 : Visualize.
Here, in step 4: Publish, you can change that size again!
The height is defined by the chart depending on the width but it will not exceed the maximum height you've defined in the settings under step 3: Visualize > Appearance:
You can also enter very high numbers like 4000 px – something we wouldn't be able to display in step 3.
Example:
If you increase the width from 500 px to 2000 px, you'll notice that the map will be 4 times larger in size while the title, annotations, and the symbols stay the same size.
- Format 500 px (exported size: 520 px with 20 px margin) :
- Format 2000 px (exported size: 2020 px with 20 px margin) :
2. Border
The Border is the white space that you want to appear around your chart. A border of 0px is perfect for web articles (for the cases where you can't embed iframes), since the article part will have borders anyway. In most case, a border of 30px or more will make your chart more pleasant to look at:
The left chart was exported with a border of 0px, the chart on the right side with a border of 30px.
3. Scale Factor
The third option is the Scale factor. It's a useful setting if you want to download your chart in higher resolution but keep the aspect ratio the same.
Example:
Here's the same image from previous example with Format set to width: 500px. If you increase the scale from Scale factor = 1x to Scale factor 4x, you'll notice that the map size will be 4 times larger but so will the title and the symbols. The map will look exactly the same but with a higher resolution.
Left: Scale Factor 1x (exported size: 520 px with 20 px margin), Right: Scale Factor 4x (exported size: 2020 px with 20 px margin) :
4. Include full header and footer
The last option is if you just want to import the chart, or the full header and footer:
Once you're done, click the "Download PNG" button. Depending on the final size of your chart, generating the PNG might take some time on our end. You'll see a loading circle indicating that.
And that's it! You'll find your downloaded PNG in your "Downloads" folder.