Highcharts Demo

author(s): Torstein Hønsi

by Richard Houltz

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://blacklabel.github.io/grouped_categories/grouped-categories.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

JavaScript

Highcharts.chart('container', {
  chart: {
    type: 'column'
  },
  title: {
    text: ''
  },
  credits: {
    enabled: false
  },
  xAxis: {
    labels: {
      autoRotation: false,
      style: {
        fontSize: 10
      }
    },
    categories: [{
      name: 'Region 1',
      categories: ['Division A', 'Division B', 'Division C']
    }, {
      name: 'Region 2',
      categories: ['Division D', 'Division E']
    }, {
      name: 'Region 3',
      categories: ['Division F', 'Division G', 'Division H', 'Division I']
    }]
  },
  yAxis: {
    title: {
      text: ''
    }
  },
  series: [{
    name: 'Divisions',
    data: [20, 25, 15, 16, 20, 12, 25, 17, 30]
  },
  {
    name: 'Divisions2',
    data: [20, 25, 15, 16, 20, 12, 25, 17, 30]
  }]
});