Advanced API

Short URLs

You may want to create a shorter URL for your charts, especially if you are sending them via email or SMS. To generate a short URL for your chart, send a POST request to https://quickchart.io/chart/create.

The endpoint takes the following JSON request body, identical to the /chart POST endpoint:

{
  width?: number;                      // Pixel width (500 by default)
  height?: number;                     // Pixel height (300 by default)
  devicePixelRatio?: number;           // Pixel ratio (2.0 by default)
  format?: string;                     // png, jpg, webp, svg, pdf, or base64
  backgroundColor?: string;            // Canvas background
  version?: string;                    // Chart.js major version: 2, 3, or 4
  key?: string;                        // API key
  chart: string | ChartConfiguration;  // Chart.js configuration
}

Here's an example using curl. You can use any library that sends an HTTP POST request:

curl -X POST \
     -H 'Content-Type: application/json' \
     -d '{"chart": {"type": "bar", "data": {"labels": ["Hello", "World"], "datasets": [{"label": "Foo", "data": [1, 2]}]}}}' \
     https://quickchart.io/chart/create

Here's an equivalent request using Python:

import json
import requests

quickchart_url = 'https://quickchart.io/chart/create'
post_data = {'chart': {'type': 'bar', 'data': {'labels': ['Hello', 'World'],
             'datasets': [{'label': 'Foo', 'data': [1, 2]}]}}}

response = requests.post(
    quickchart_url,
    json=post_data,
)

if (response.status_code != 200):
    print('Error:', response.text)
else:
    chart_response = json.loads(response.text)
    print(chart_response)

You will get a response that looks like this:

{
  "success": true,
  "url": "https://quickchart.io/chart/render/9a560ba4-ab71-4d1e-89ea-ce4741e9d232"
}

Go to the URL in the response to render your chart.

Please note the following limitations:

• It can take a couple seconds for short URLs to become active globally.
• Request inputs are not validated before the URL is created. The chart is only rendered when the URL is visited. Use /api/validate-chart to check the request first.
• If your chart includes Javascript, you must supply your chart definition as a string (see using JS functions).
• Saved charts expire after 3 days for free users, 6 months for paid users.

Templates

If you want to generate many charts, but they only differ slightly, you may prefer to use chart templates. Any chart with a Short URL can also be used as a template.

Customize a template by adding URL parameters to the template URL. The following template parameters are supported:

• width, height - Chart dimensions in pixels
• backgroundColor - Background color of the chart
• title - The title of the chart
• labels - Comma-separated labels for the label axis of a chart (usually the X axis)
• data1, data2, ..., dataN - Comma-separated data values for each dataseries
• label1, label2, ..., labelN - The label for each dataseries
• backgroundColor1, ..., backgroundColorN - Comma-separated backgrounds for each dataseries
• borderColor1, ..., borderColorN - Comma-separated border colors for each dataseries

For example, this URL will take template zf-abc-123 and update its title to "New title":

https://quickchart.io/chart/render/zf-abc-123?title=New title

We can add a labels URL parameter:

https://quickchart.io/chart/render/zf-abc-123?title=New title&labels=Q1,Q2,Q3,Q4

Or even override multiple datasets:

https://quickchart.io/chart/render/zf-abc-123?data1=40,60,80,100&data2=5,6,7,8

Dataset overrides are supported for data1 through data20, with the same range for labels and colors. URL-encode parameter values, especially colors containing #.

In addition to plain numbers, templates also accept (x, y) data values and arbitrary JSON objects.

An example walkthrough with a live template can be viewed here.

IFrames

By default, short URLs/templates render as images and are not interactive. If you'd like to display a chart with interactive tooltips in an iframe, take the unique portion of the shortened URL and append it to the /chart-maker/view/ endpoint.

For example, given the short URL:

https://quickchart.io/chart/render/9a560ba4-ab71-4d1e-89ea-ce4741e9d232

Here is the corresponding iframe URL:

https://quickchart.io/chart-maker/view/9a560ba4-ab71-4d1e-89ea-ce4741e9d232

You can embed it like a regular iframe. Be sure to set a frame width and height that is compatible with your chart. Here's an HTML example:

<iframe src="https://quickchart.io/chart-maker/view/9a560ba4-ab71-4d1e-89ea-ce4741e9d232" frameborder="0" height="300" width="500" title="My chart"></iframe>

Expiration

Expiration of short URLs and templates varies based on whether you've created them using the /chart/create API endpoint, or via the Chart Maker.

	Free Tier	Professional Plan
API	3 days	6 months Can be extended by contacting support
Advanced Chart Editor (Sandbox)	3 days	6 months Can be extended by contacting support
Chart Maker	60+ days Extended when rendered near expiration	6+ months Extended when rendered near expiration

For Chart Maker charts, rendering with fewer than 30 days remaining extends the expiration to 60 days for free charts or 6 months for paid charts. API-created charts do not receive this automatic extension.

An expired short URL will return a 404 Not Found error. Download the image if you need to keep a permanent copy.