Chart generator

An HTTP service that turns Google Charts ChartWrapper JSON into PNG or SVG images. It renders ColumnChart, BarChart, PieChart and BubbleChart the way Google Charts does, without a browser and without network access.

Questions, API keys or problems with a chart: charts@wisemetering.com.

ColumnChart

Vertical bars and lines, on one or two value axes, optionally stacked.

BarChart

Horizontal bars: categories top to bottom, values along the bottom.

PieChart

Pie or donut, with percentages in the slices and a legend beside, below or around it.

BubbleChart

Bubbles placed by x and y, colored by group and sized by a value.

Request

POST / with Content-Type: application/json:

{
  "args": {
    "chartType": "ColumnChart",
    "dataTable": [["Month", "kWh"], ["Jan", 1250], ["Feb", 1130]],
    "options": {"width": 800, "height": 350, "colors": ["#688715"]}
  },
  "format": "png",
  "forceUncutLine": false
}

When API keys are required, send one as Authorization: Bearer <key>. GET /up and GET /health answer {"status":"ok"} (and GET /ping, ping, as the Node service did).

Responses

Errors

Messages of 400 responses:

Options for every chart

Options may be null; numbers may be strings ("50") and sizes percentages ("80%"). Colors are #rrggbb, #rgb, transparent or basic names.

Text styles

Every textStyle and titleTextStyle accepts:

Text is always drawn in DejaVu Sans.

Vertical bars and lines, on one or two value axes, optionally stacked.

Data

• First row: header. First column: category labels (strings); each following column is a series.
• A {"role": "style"} header after a series colors each bar: "#hex" or "color: #hex" (empty = series color).
• A {"role": "annotation"} header after a series adds text above each bar.
• null leaves a gap: no bar, or a break in a line. Numbers may be strings.

Options

Besides the options for every chart:

Examples

Simple

Title, axis title, zero baseline.

Open in the playground

Grouped

Several series side by side, legend at the bottom, vAxis.format.

Open in the playground

Stacked

isStacked, legend on top.

Open in the playground

Bars and lines on two axes

series.N.type, targetAxisIndex, lineDashStyle, labels at 90°.

Open in the playground

Colors per bar and annotations

style and annotation roles, hidden value axis.

Open in the playground

Horizontal bars: categories top to bottom, values along the bottom.

Data

• Same as ColumnChart: labels, then series, with optional style and annotation role columns.
• Negative values extend left of the baseline.

Options

Besides the options for every chart:

Examples

Simple

Labels left of the bars, value axis at the bottom.

Open in the playground

Deviation

Negative values, viewWindow, labels inside, colors per bar, annotations.

Open in the playground

Pie or donut, with percentages in the slices and a legend beside, below or around it.

Data

• Rows of [label, value]. Negative values count as zero.
• With legend labeled, names that don't fit beside the pie wrap onto several lines unless the request has "forceUncutLine": true.

Options

Besides the options for every chart:

Examples

Pie

Percentages inside, legend on the right, title.

Open in the playground

Donut, labeled

pieHole, legend labeled, small slices merged.

Open in the playground

Donut, legend at the bottom

pieHole 0.5, legend bottom.

Open in the playground

Bubbles placed by x and y, colored by group and sized by a value.

Data

• Rows of [id, x, y, group, size]; group and size are optional.
• id is drawn on the bubble. Rows without numeric x and y are skipped.
• Each distinct group gets the next color and a legend entry.
• The radius goes from 5 to 30 px, with the bubble area linear in size.

Options

Besides the options for every chart:

Examples

Bubbles by group and size

Groups, sizes, axis titles, legend at the bottom.

Open in the playground