Highcharts test tool

by Rajesh Danabal

HTML

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

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

CSS

#container {
  min-width: 500px;
  max-width: 800px;
  height: 500px;
  margin: 1em auto;
}

JavaScript

$('#container').highcharts({
  chart: {
    type: 'column',
    events: {
      load: function() {
        var chart = this,
          howManyLines = 3;
        for (let i = 0; i < howManyLines; i++) {
          chart.renderer.rect(chart.plotLeft + i * chart.plotSizeX / (howManyLines - 1) - 1, chart.plotTop + chart.plotSizeY, 1, 70).attr({
            fill: 'red'
          }).add()
        }

      }
    }

  },
  xAxis: [{
    visible: true,
    labels: {
      enabled: true,
    },
    categories: ["A", "B", "C", "D", "E"]
  }, {
    categories: ["Jun-19", "Aug-19"],
    visible: true,
    lineWidth: 0
  }],

  series: [{
    data: [2332, 4234, 2312, 5555, 1222],
    xAxis: 0
  }, {
    data: [10, 20],
    xAxis: 1
  }]

});