Can I use it in an tag?

Yes: GET /v1/chart-image?c= &api_key=… returns the PNG directly. Keep long configs in POST.

Chart Maker Online

Render bar, line, area, pie, doughnut, scatter and sparkline charts from a Chart.js-like JSON config as PNG or SVG, by a URL usable in <img> and emails.

Result

Press “Run” to see the result.

Describe the chart in JSON and get an image: {"type":"bar","data":{"labels":[…],"datasets":[{"label":"…","data":[…]}]},"options":{"title":"…"}}. Types: bar, horizontal-bar (or Chart.js indexAxis: "y"), line, area, pie, doughnut, scatter (points {x, y}) and sparkline. Several datasets are grouped (or stacked: true), a dataset of a bar chart can be drawn as a line, gaps (null) break lines, and tension smooths them. Options: title, subtitle, legend (top, bottom, right, false), x_label / y_label, min / max, values (data labels), prefix / suffix (" ₫", "%"), locale (vi writes 1.234,5 and 12 tr / 3 tỷ on axes), theme (light / dark), font_size and colours per dataset (color, backgroundColor, an array for one colour per bar). The usual Chart.js keys (plugins.title, plugins.legend, scales.y.min, scales.x.stacked…) are understood, so most QuickChart-style configs work as they are.

Because it answers GET with the config URL-encoded in c, the URL can be put straight into <img src>, an e-mail, a Slack / Zalo message or a Markdown / PDF report. PNG (default) and JPEG are drawn by our own renderer with the Be Vietnam Pro font, so Vietnamese text looks the same everywhere; scale=2 gives a sharp image on retina screens. SVG keeps the text as vector outlines by default (exact rendering without fonts), svg_text=text writes real <text> elements instead.

Size: width × height up to 2000 px and 4 megapixels with scale, up to 20 datasets and 10,000 points. The colours follow a colour-blind-checked palette; the renderer is our own code (not QuickChart or Chart.js).

Use this in your code

curl "https://apibox.io.vn/v1/chart-image?c=%7B%22type%22%3A%22bar%22%2C%22data%22%3A%7B%22labels%22%3A%5B%22T1%22%2C%22T2%22%2C%22T3%22%5D%2C%22datasets%22%3A%5B%7B%22label%22%3A%22Doanh%20thu%22%2C%22data%22%3A%5B12%2C19%2C7%5D%7D%5D%7D%7D" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -o output

const res = await fetch('https://apibox.io.vn/v1/chart-image?c=%7B%22type%22%3A%22bar%22%2C%22data%22%3A%7B%22labels%22%3A%5B%22T1%22%2C%22T2%22%2C%22T3%22%5D%2C%22datasets%22%3A%5B%7B%22label%22%3A%22Doanh%20thu%22%2C%22data%22%3A%5B12%2C19%2C7%5D%7D%5D%7D%7D', {
  method: 'GET',
  headers: {
    Authorization: 'Bearer YOUR_API_KEY',
  },
});
const blob = await res.blob();

import requests

res = requests.get(
    "https://apibox.io.vn/v1/chart-image?c=%7B%22type%22%3A%22bar%22%2C%22data%22%3A%7B%22labels%22%3A%5B%22T1%22%2C%22T2%22%2C%22T3%22%5D%2C%22datasets%22%3A%5B%7B%22label%22%3A%22Doanh%20thu%22%2C%22data%22%3A%5B12%2C19%2C7%5D%7D%5D%7D%7D",
    headers={"Authorization": "Bearer YOUR_API_KEY"},
    timeout=30,
)
open("output", "wb").write(res.content)

<?php
$ch = curl_init('https://apibox.io.vn/v1/chart-image?c=%7B%22type%22%3A%22bar%22%2C%22data%22%3A%7B%22labels%22%3A%5B%22T1%22%2C%22T2%22%2C%22T3%22%5D%2C%22datasets%22%3A%5B%7B%22label%22%3A%22Doanh%20thu%22%2C%22data%22%3A%5B12%2C19%2C7%5D%7D%5D%7D%7D');
curl_setopt_array($ch, [
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_HTTPHEADER => ['Authorization: Bearer YOUR_API_KEY'],
]);
$response = curl_exec($ch);
file_put_contents('output', $response);

API documentation → Get a free API key

FAQ

Can I use it in an <img> tag?

Yes: GET /v1/chart-image?c=<URL-encoded JSON>&api_key=… returns the PNG directly. Keep long configs in POST.

Is it compatible with Chart.js / QuickChart configs?

The common parts are: type, data.labels, datasets (label, data, backgroundColor, borderColor, fill, tension, type), indexAxis, plugins.title / legend, scales min / max / stacked.

Does Vietnamese text render correctly?

Yes, PNG and SVG draw text from the Be Vietnam Pro outlines, so diacritics are exact without any installed font.