Render flags

Our visualization embeds support “render flags” to change the behavior of the embedded visualization. They can be used to enforce dark mode, disable all interactive elements, or hide the header and footer of a chart. Here's the list of all supported render flags:

Flag	Example value	Description
dark	`true`, `false`, `"auto"`	For enforcing/disabling the dark mode, or activating the automated dark mode
plain	`true`, `false`	In plain mode, the visualization will be shown without the header and footer.
search	any text	Can be used to pre-fill the search box in visualizations that support search (currently only tables)
static	`true`, `false`	In static mode, any interactive elements in the visualization will be disabled and links will show up as normal text.
logo	`"on"`, `"off"`	If your custom theme includes a logo, this flag can be used to force the logo to be shown or hidden
logoId	any text	If your theme defines multiple logos, you can use this flag to define which logo to show
transparent	`true`, `false`	If set to true the visualization background will be set to transparent instead of the defined theme background.
fitchart	`true`, `false`	If set to true, the visualization will adjust itself to fit into the available space, determined by the embed height, rather than taking its configured, or preferred height. Note that this option isn't supported for tables, horizontal bars, dot, range, or arrow plots, so will have no effect in those cases.

How to set render flags in embed codes?

For the iframe embed code, you can set render flags by appending them as URL parameters in the embed code:

<iframe src="https://datawrapper.dwcdn.net/ABCDE/5/?dark=true&logo=on" ...></iframe>

For the script embed code, you can add data attributes on the script, e.g

<div style="min-height:400px">
  <script data-logo="on" data-dark=true src="https://datawrapper.dwcdn.net/iZP4p/embed.js" ...></script>
</div>