Highcharts Demo

author(s): Torstein Hønsi

by Santosh Giridhara

HTML

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

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

JavaScript

Highcharts.chart('container', {

  chart: {
    type: 'xrange',
    height: 100
  },

  legend: {
    enabled: false
  },

  title: {
    text: null
  },
credits:{
enabled:false
},
  xAxis: {
    categories: Highcharts.defaultOptions.lang.shortMonths,
    min: 0.5,
    max: 11.5,
    tickmarkPlacement: 'on',
    showLastLabel: false,
    labels: {
      align: 'left',
      x: 2
    }
  },

  yAxis: {
    type: 'category',
    gridLineWidth: 0
  },

  series: [{
    pointWidth: 25,
    data: [{
      x: 0,
      x2: 12,
      partialFill: 4 / 12,
      y: 0
    }]
  }]

});