Grouped categories demo

author(s): Black Label

by Ravi A

HTML

<script src="https://blacklabel.github.io/grouped_categories/grouped-categories.js"></script>
<link rel="stylesheet" href="https://blacklabel.github.io/grouped_categories/css/styles.css">
<script src="https://code.highcharts.com/js/highcharts.js"></script>
<div id="container" class="chart-container"></div>

JavaScript

$(function () {
var GCdata=JSON.parse('{"title":{"text":""},"chart":{"type":"column"},"xAxis":{"categories":[{"name":2018,"categories":[{"name":"July","categories":["IL","OR","WA","CA"]},{"name":"December","categories":["IL","OR","WA","CA"]},{"name":"November","categories":["IL","OR","WA","CA"]},{"name":"September","categories":["IL","OR","WA","CA"]},{"name":"October","categories":["IL","OR","WA","CA"]},{"name":"August","categories":["IL","OR","WA","CA"]}]},{"name":2019,"categories":[{"name":"July","categories":["IL","OR","WA","CA"]},{"name":"February","categories":["IL","OR","WA","CA"]},{"name":"January","categories":["IL","OR","WA","CA"]},{"name":"March","categories":["IL","OR","WA","CA"]},{"name":"April","categories":["IL","OR","WA","CA"]},{"name":"May","categories":["IL","OR","WA","CA"]},{"name":"June","categories":["IL","OR","WA","CA"]}]}]},"yAxis":[{"title":{"text":"Net Sales ($)"},"opposite":false},{"title":{"text":"YOY Sales Growth (%)"},"opposite":true},{"title":{"text":"PY Sales($)"},"opposite":true}],"series":[{"name":"Net Sales ($)","data":[26769223.91000989,34477929.360010006,26769223.91000989,26769223.91000989,26769223.91000989,26769223.91000989,26769223.91000989,26769223.91000989,26769223.91000989,26769223.91000989,26769223.91000989,26769223.91000989,26769223.91000989,26769223.91000989],"yAxis":0},{"name":"YOY Sales Growth (%)","data":[0.46386523758164333,-0.26549772221588686,0.46386523758164333,0.46386523758164333,0.46386523758164333,0.46386523758164333,0.46386523758164333,0.46386523758164333,0.46386523758164333,0.46386523758164333,0.46386523758164333,0.46386523758164333,0.46386523758164333,0.46386523758164333],"yAxis":1},{"name":"PY...