Exporting as PNG, PDF & SVG
Once you're happy with the design of your visualization, you can publish it and/or export it as a PNG (free) or PDF/SVG (starting at the Custom plan), e.g. to embed it in presentations. In this tutorial, you'll learn how to do so with the API.
Request the export
The actual request is fairly simple. Make sure to replace
<YOUR_TOKEN_HERE> with your chart ID and your API Access Token:
curl --request GET \ --url 'https://api.datawrapper.de/v3/charts/<ID>/export/png?unit=px&mode=rgb&plain=false&zoom=2&borderWidth=20' \ --header "Authorization: Bearer <YOUR_TOKEN_HERE>" \ --header 'accept: */*' \ --output 'final.png'
The output gets saved in the folder where you run the command. Let's look at the request in detail, especially the
As you can see, the URL includes all parameters with which we define the output. It looks complicated, but almost nothing is mandatory.
To save time, simply go to the API reference developer.datawrapper.de/v3.0/reference#getchartsidexportformat and you'll find an interface in which you can just input the desired parameters.
Let's break the URL down anyway. The parameters can be different depending on if you want to download a PNG, PDF or SVG. If unsure, visit the export interface of the visualization in the Datawrapper app (step 4: Publish) and see which features are available there. Scroll down to see the interfaces.
|.../export/pdf||Here you define the output format.|
|unit||Defines the unit in which the ||--|
|mode||Which color mode the output should be in. Default is ||--||--|
|width||Width of the visualization. If not specified, it takes the chart width.||Number||Number||Number|
|height||Height of the visualization. If not specified, it takes the chart height.||Number||Number||Number|
|plain||Defines if only the visualization should be exported (||--|
|zoom||Defines the chart scale. E.g, a zoom of 3 makes the chart 3 times wider and taller in px size resulting in a higher resolution chart. Default is ||Number||--||--|
|scale||Defines the chart scale for PDF exports, similar to the ||--||Number||--|
|borderWidth||Margin around the visualization. E.g., a borderWidth of 20px gives the visualization a 20px margin. Default is ||Number||Number||--|
|borderColor||Color of the border. Default is the same color as the visualization background (most often, that's white).||Color||Color||--|
|transparent||Set to ||--||--|
Updated over 2 years ago