Highcharts test tool

by Sandeep Parashar

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/offline-exporting.js" type="text/javascript"></script>
<script src="http://blacklabel.github.io/grouped_categories/grouped-categories.js" type="text/javascript"></script>

<div id="container" style="height: 600px"></div>

JavaScript

// mapping between SVG attributes and the corresponding options
// Highcharts.seriesTypes.bar.prototype.pointAttrToOptions.dashstyle = 'dashStyle';




$(function() {
  Highcharts.chart('container', {

    "chart": {
      "renderTo": 'container',
      "type": 'bar'
    },

    "style": {
      " fontFamily": "Arial"
    },
    "credits": {
      "enabled": false
    },
    "navigation": {
      "menuItemStyle": {
        "fontFamily": "Arial",
        "fontsize": "12px"
      }
    },
    "chart": {
      "type": "column"
    },
    "lang": {
      "tooltip_key": "Show Risk Level View"
    },
    "exporting": {
      "fallbackToExportServer": false,
      "buttons": {
        "customButton": {
          "_titleKey": "tooltip_key",
          "text": "Show Risk Level View"
        }
      }
    },
    "customButtonClickFunction": "CumulativeRiskMitigateChart('CumulativeRiskMitigatedRiskLevelView');",
    "legend": {
      "align": "center",
      "layout": "horizontal",
      "verticalAlign": "bottom"
    },
    "yAxis": {
      "reversedStacks": false,
      "title": {
        "enabled": false
      }
    },
    "plotOptions": {
      "column": {
        "stacking": "normal"
      }
    },
    "title": {
      "style": {
        "fontFamily": "Arial",
        "fontSize": "12px",
        "fontWeight": "Bold"
      },
      "text": "Cumulative Risk Mitigated by Plan-L1 - Most Likely Case"
    },
    "xAxis": {
      "categories": [{
        "name": "Current Year (2017)",
        "categories": ["Mitigated", "Not Mitigated"]
      }, {
        "name": "Next Yr (2018)",
        "categories": ["Mitigated", "Not Mitigated"]
      }, {
        "name": "5 Yrs Out (2021)",
        "categories": ["Mitigated", "Not Mitigated"]
      }, {
        "name": "7 Yrs Out (2023)",
        "categories": ["Mitigated", "Not Mitigated"]
      }]
    },
    "series": [{
      "color": "#FF0000",
      "name": "High",
      "data": [298, 199, 448, 271, 772, 494, 935, 562]
    }, {
     ...