Embedding charts
The embed snippet, responsive sizing, dark mode, and updating in place.
A published chart has a stable embed URL at app.kitegraph.com/embed/<id>. Drop it into any page as an iframe; a small script sizes it to its content. Publish a chart in the editor or through the charts API.
The snippet
Publishing returns a ready iframe and the embed URL. Paste the iframe where the chart should appear, and include the script once per page:
Responsive height
The chart measures its content and posts its height to the host page; embed.js resizes the iframe to match, so bars, legends, and labels never clip on a narrow column. Include the script once, even with several embeds on a page. Without it, the iframe keeps the fixed height in the snippet and the chart reflows within that box.
Categorical charts (bars, dot and range plots) size to their row count, so a 20-row chart is taller than a 5-row one at every width. Aspect charts (line, area, column) keep their authored proportion.
Dark mode
An embed can follow the reader's color scheme. Turn on "Match the reader's dark mode" in the editor (Layout), and the chart switches with the host page's prefers-color-scheme. Images and video keep the mode they were exported in.
Updating
Republishing keeps the URL. Edit the chart, publish again, and every page embedding it shows the new version with no change to the snippet.
oEmbed
The share URL supports oEmbed, so a platform that resolves oEmbed links expands a Kitegraph URL into the live chart.