Charts
Manual for proper chart usage
Supported Charts
Currently we support five kinds of charts in your template
Bar chart - both horizontal and vertical with ability to stack y-axis
Line chart
Pie chart
Doughnut chart - uses pie chart menu with the ability to set the cutout percentage to create doughnut chart
Radar chart
Data structures
General structure
Generally, you would have JSON data that looks like this for your modification,
Chart modification data consists of two main fields,
Dataset object
Dataset object consists of three fields,
backgroundColor
backgroundColor
The format depends on the type of chart.
Color formatted string,
Bar chart
Line chart
Radar chart
List of color formatted strings,
Pie chart
Doughnut chart
Color must be formatted according to these formats,
Hex -
#FFFFFF
RGBA -
rgba(255, 255, 105, 0.8)
which support alpha transparency
Pie and doughnut charts needs to take list of colors because each color represent each cut out, while the other type of charts only need a single color to represent the data.
Data validation
Our API will validate your modification and return a user friendly error message. However, it is useful to know what is considered as a valid chart modification because chart can be trickier than the rest of the template's objects.
Rules
labels
must be uniquelabels
length must match the length of thedata
Dataset's
label
must be uniqueIf
backgroundColor
requires list of colors, then the length must match the length of thelabels
backgroundColor
must have the right format i.e. either hex or RGBA value
Don't worry about the complexity. Our API will return proper error messages when any of the rules are not met.
Using Test API Console for guidance
It is also a good idea to play around in our Test API Console page to get a feel about the correct modification. Only successful image generation will count towards your quota.
Using Data Editor
Template editor comes with an easy to use data editor in case you want to create a static chart (not modified through API) or to create a default chart which can be overridden through API.
Data editor comes in two modes,
User friendly UI that validates the data as you type and will generate the proper JSON.
JSON editor that allows you write the JSON yourself.
In both mode, data will always be validated so you don't have to worry about making mistake. The error will guide you on what to fix.
Overriding default chart
As mentioned, you can create a default chart with all the colors and styles using data editor.
When sending the image creation request, you can choose to override the data and use the colors set with by the data editor. To do this, send the request with the same dataset label
that you want to override.
You can send a modification request like so to override the data
and use existing backgroundColor
It is important that you set the same dataset's label
in the modification request so it knows which dataset to merge with.
Last updated