Highcharts Demo

author(s): Torstein Hønsi

by mlmason

HTML

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

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

JavaScript

$(function() {
  // Create the chart
  $('#container').highcharts({
    chart: {
      type: 'column'
    },
    title: {
      text: 'African American Legislatures'
    },
    subtitle: {
      text: 'Click the columns to view each chamber. Source: Michigan Manuals: 1961-2015'
    },
    xAxis: {
      type: 'category'
    },
    yAxis: {
      title: {
        text: 'Percent'
      }

    },
    legend: {
      enabled: false
    },
    plotOptions: {
      series: {
        borderWidth: 0,
        dataLabels: {
          enabled: true,
          format: '{point.y:.1f}%'
        }
      }
    },

    tooltip: {
      headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
      pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'
    },

    series: [{
      name: 'Then and Now',
      colorByPoint: true,
      data: [{
        name: '1961 Senators',
        y: 0,
        drilldown: 'Senators'
      }, {
        name: '2015 Senators',
        y: 13,
        drilldown: 'Senators'
      }, {
        name: '1961 Representatives',
        y: 7,
        drilldown: 'Representatives'
      }, {
        name: '2015 Representatives',
        y: 9,
        drilldown: 'Representatives'
      }, ]
    }],
    drilldown: {
      series: [{
        name: 'Senators',
        id: 'Senators',
        data: [
          [
            '1963',
            0
          ],
          [
            '1965',
            2
          ],
          [
            '1967',
            5
          ],
         
          [
            '1971',
            5
          ],
        
          ['1975',
          8],
         
          ['1979',
          5],
        
          ['1983',
          5],
        
          ['1987',
          5],
         
          ['1991',
          8],
        
          ['1995',
          10],
         
          ['1999',
          13],
         
          ['2003',
          10],
         
         ...