Knowledge Base

Search documentation by Keyword

5.2.2 Graph / Chart data

At the startup of the graph BOA will send his request to the endpoint to your iAPI. You need to send all the data in your response, so the chart can be build with your data.

Request: url/onclick.endpoint/id

Sample: url/chart/customersales/123

Result: data to create the chart.

{
“chart”: {
“data”: [
{
“month”: “Jul”,
“16Debet”: 91026.65,
“16Credit”: 13642.39,
“17Debet”: 81154.46,
“17Credit”: 63782.76
},{
“month”: “Aug”,
“16Debet”: 55394.01,
“16Credit”: 4146.51,
“17Debet”: 42131.31,
“17Credit”: 58718.39
},{
“month”: “Sep”,
“16Debet”: 47224.12,
“16Credit”: 2787.89,
“17Debet”: 42157.41,
“17Credit”: 40214.29
},{
“month”: “Oct”,
“16Debet”: 106196.52,
“16Credit”: 200834.14,
“17Debet”: 40889.43,
“17Credit”: 2279.42
},{
“month”: “Nov”,
“16Debet”: 48437.26,
“16Credit”: 66301.66,
“17Debet”: 47477.81,
“17Credit”: 56979.84
},{
“month”: “Dec”,
“16Debet”: 70183.9,
“16Credit”: 6922.61,
“17Debet”: 57878.59,
“17Credit”: 89498.24
},{
“month”: “Jan”,
“16Debet”: 70611.4,
“16Credit”: 94323.92,
“17Debet”: 65398.25,
“17Credit”: 104797.76
},{
“month”: “Feb”,
“16Debet”: 65128.65,
“16Credit”: 93404.85,
“17Debet”: 52173.84,
“17Credit”: 47789.03
},{
“month”: “Mar”,
“16Debet”: 45521.06,
“16Credit”: 53781.59,
“17Debet”: 48040.31,
“17Credit”: 62582.84
},{
“month”: “Apr”,
“16Debet”: 48255.37,
“16Credit”: 42343.5,
“17Debet”: 51060.76,
“17Credit”: 45996.81
},{
“month”: “May”,
“16Debet”: 62680.23,
“16Credit”: 62729.35,
“17Debet”: 33270.77,
“17Credit”: 34142.09
},{
“month”: “Jun”,
“16Debet”: 73034.82,
“16Credit”: 82631.68,
“17Debet”: 55082.73,
“17Credit”: 49103.35
}],
“title”: “Customers”,
“description”: “Sales overview”,
“max”: 200834.14,
“min”: 0,
“cumul”: 783693.99,
“axis”: “Amount euro”,
“legend”: [
{
“name”: “month”,
“title”: “month”
},{
“name”: “16Debet”,
“title”: ” 16 – Debet.”
},{
“name”: “16Credit”,
“title”: ” 16 – Credit.”
},{
“name”: “17Debet”,
“title”: ” 17 – Debet.”
},{
“name”: “17Credit”,
“title”: ” 17 – Credit.”
}]}}

  • chart: contains the complete object.
  • data: contains the data for the chart. Data is an array with all the objects for the graph. In this case the array contains 12 objects for each month of the year.
  • Each dataobject has at least 2 elements. The first element is the name, from the second element on it contains data. In this sample there are 5 elements:
    • month: name for the graph. This is the legend for the horizontal axis.
    • 4 elements with data. This is a chart with 4 bars, lines or pies.
  • title: the title to show on the top of the chart.
  • description: text to show on the line below the title.
  • max: the highest value you want to use for the bar chart. BOA will use this value to divide the height of you chart in 10 row blocks.
  • min: you can set a value as minimum value. This according to your date. In most cases this will be set to 0.
  • cumul: the maximum value for the line chart you want to use. BOA will divide your chart in 10 blocks.
  • axis: the legend to use for the vertical axis.
  • legend: is an array with a legend for your data. This way you can have fieldnames in your data array, and convert it to a description that will be shown on the chart. The array has to be the same lenght as the data objects. You need to provide objects which has two elements:
    • name: how it is called in the data array.
    • title: which text must be shown in the graph.

The above response gives the following graph.

This is the chart build with the above data.