Funnel chart

JSON used as input for Funnel chart rendering consists of multiple elements.

Basic structure

{
  "elements": [
    {
      "type": "funnel",
      "values": [ ... ]
    }
  ]
}

Common elements

NameDescriptionExample
chartId
Chart view identifier. Refer to REST API.
chart_3-FDEp6Q41fb_s3fwVc7F9H
bg_color
Defines the color of the background for the entire chart
#e5e5e5
is_decimal_separator_comma
Determines whether to use comma as decimal separator. [0, 1]1
is_thousand_separator_disabled
Determines whether to use the thousands separator or not. [0, 1]1
tooltip

Defines the basic tooltip settings for the entire chart.

NameDescriptionExample
mouse
Mouse sensitivity2
shadow
[true, false]true
stroke
[0, 1]1
colour
Default font color for tooltips
#202020
background
Default background for tooltips.
"#ffffff"
 

Example

{
	"chartId": "chart_3-FDEp6Q41fb_s3fwVc7F9H",
	"bg_colour": "#e5e5e5",
	"is_decimal_separator_comma": 1,
	"is_thousand_separator_disabled": 1,
	"tooltip": {
	    "mouse": "2",
    	"shadow": true,
	    "stroke": 1,
	    "colour": "#202020",
	    "background": "#ffffff"
	},
	"options": {}
} 

 

"elements" content

Each object in array elements describe one chart element. In example below we have only one element that has type funnel and contains array with 4 values. Each value object consists of value, label, tool tip, colour, context.

NameDescriptionExample
type
Type of the chart. For funnel chart, the value is "funnel"funnel
values
NameDescriptionExample
value
Number specifying the value of this part12345.4567
tip
Tooltip text to display on mouse hoverThis is tooltip
label
Value label displayed on the left side of a chart (optional)This is label
context
If defined, context will be send to the client as event parameter 
colour
Color for this part of funnel chart 
 
 "elements": [
    {
      "type": "funnel",
      "values": [
        {
          "value": 444835.123456789,
          "tip": "Austria\n444835.1",
          "label": "444.835",
          "colour": "#C1D8DF",
          "context": "{\"dataLink\":\"3_-2043221543\",\"identifierQuery\":\"[L_COUNTRY={Austria}]\"}"
        },
        {
          "value": 730974,
          "tip": "Canada\n730974",
          "label": "730.974",
          "colour": "#9A60A1",
          "context": "{\"dataLink\":\"3_-1852385212\",\"identifierQuery\":\"[L_COUNTRY={Canada}]\"}"
        },
        {
          "value": 546650,
          "tip": "France\n546650",
          "label": "546.650",
          "colour": "#187846",
          "context": "{\"dataLink\":\"3_-1863819183\",\"identifierQuery\":\"[L_COUNTRY={France}]\"}"
        },
        {
          "value": 643782.34,
          "tip": "Germany\n643782.3",
          "label": "643.782",
          "colour": "#C97B36",
          "context": "{\"dataLink\":\"3_-547347785\",\"identifierQuery\":\"[L_COUNTRY={Germany}]\"}"
        }
      ]
    }
  ]

Examples

  File Modified
File FUNNEL_allIndicators_drilldownOnXAxis.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_allIndicators.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_dateInterval_allIndicators_drilldownOnXAxis.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_dateInterval_allIndicators.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_dateInterval_drilldown_allIndicators_drilldownOnXAxis.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_dateInterval_drilldown_allIndicators.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_dateInterval_drilldown_drilldownOnXAxis.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_dateInterval_drilldown.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_dateInterval_drilldownOnXAxis.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_dateInterval.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_drilldown_allIndicators_drilldownOnXAxis.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_drilldown_allIndicators.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_drilldown_drilldownOnXAxis.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_drilldown.json Apr 01, 2016 by Lubomir Elko
File FUNNEL_drilldownOnXAxis.json Apr 01, 2016 by Lubomir Elko
File FUNNEL.json Apr 01, 2016 by Lubomir Elko

 

  • No labels