Highcharts Demo

author(s): Torstein Hønsi

by Arvind Pal

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>

<div id="container"></div>

CSS

#container {
	max-width: 660px;
	margin: auto;
	height: 400px;
	margin: 0 auto;
}

JavaScript

var colors = Highcharts.getOptions().colors,
    categories = [
    		"Asset Class",
        "Customer Type",
        "Entity Status",
        "Customer Country",
        "Pim Type"  
    ],
    data = [
        {
            "y":18982,
            "color": colors[0],
            "drilldown": {
                "name": "Asset Class",
                "categories": [
                    "Equity", 
                    "Etf",
                    "Futures",
                    "Index",
                    "option","Derivatives",
                    "Fix",
                    "Funds",
                    "Warrants"
                ],
                "data": [
                    3913,
                    3370,
                    1751,
                    1711,
                    1684,
                    1656,
                    1653,
                    1626,
                    1618
                ]
            }
        } , 
        {
            "y": 15537,
            "color": colors[1],
            "drilldown": {
                "name": "Customer Type",
                "categories": [
                    "Enterprise",
										"Academic",
                    "End User",
                    "Non Profit"
                ],
                "data": [
                   5583,
                    3367,
                    3318,
                    3269
                ]
            }
        } ,
        {
            "y":11153,
            "color": colors[2],
            "drilldown": {
                "name": "Entity Status",
                "categories": [
                    "Active",
                    "Dissolved",
                    "In Administration",
                    "Inactive",
                    "Suspended"
                ],
                "data": [
                   3846,
                    2294,
                    1698,
                    1689,
                    1626
                ]
            }
        } ,
        {
            "y":...