Highcharts Demo

author(s): Torstein Hønsi

by Geo George

HTML

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

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

JavaScript

var chart = Highcharts.chart('container', {

  chart: {
    type: 'bar',
    marginLeft: 10
  },
  
  plotOptions: {
  	bar: {
    	dataLabels: {
      	enabled: true
      }
    }
  },

  xAxis: {
    left: '50%',
    categories: ['15-19', '20-21'],
    lineWidth: 0,
    tickWidth: 0,
    labels: {
      align: 'left',
      x: -18
    },
    title: {
    	text: 'Age Group',
      align: 'high',
      rotation: 0,
      x: 40
    }
  },

  yAxis: [{
    left: '55%',
    width: '45%',
    labels: {
      enabled: false
    },
    title: {
      x: -160,
      text: 'Female'
    },
    gridLineWidth: 0
  }, {
    //reversed: true,
    width: '45%',
    offset: 0,
    labels: {
      enabled: false
    },
    title: {
      x: 170,
      text: 'Male'
    },
    gridLineWidth: 0
  }],

  series: [{
    data: [1, 3]
  }, {
    data: [2, 5],
    yAxis: 1
  }]
});