Highcharts Column Chart

Get the all transactions in a given date in a series on the chart

HTML

<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

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

JavaScript

$(function() {
  $('#container').highcharts({
    chart: {
      type: 'column',
      spacingRight: 20,
      zoomType: 'x'
    },
    title: {
      text: 'Transactions Done'
    },
    subtitle: {
      text: 'All the disbursements done'
    },
    xAxis: {
      type: 'datetime',
      crosshair: true,
      title: {
        text: 'Dates'
      },
      tickInterval: 24 * 3600 * 1000,
      dateTimeLabelFormats: {
        day: '%b %e'
      },
    },
    yAxis: {
      min: 0,
      title: {
        text: 'Transanctions'
      }
    },
    tooltip: {
      shared: true,
    },
    plotOptions: {
      series: {
        stacking: 'normal'
      },
      column: {
        pointPadding: 0.2,
        borderWidth: 0
      }
    },
    series: [{
      name: 'success',
      data: [
        [1466553600000, 0],
        [1464912000000, 6],
        [1463788800000, 1],
        [1463529600000, 1],
        [1462492800000, 1],
        [1462406400000, 4]
      ]
    }, {
      name: 'failed',
      data: [
        [1466553600000, 0],
        [1464912000000, 0],
        [1463788800000, 0],
        [1463529600000, 0],
        [1462492800000, 0],
        [1462406400000, 0]
      ]
    }, {
      name: 'in progress',
      data: [
        [1466553600000, 6],
        [1464912000000, 0],
        [1463788800000, 0],
        [1463529600000, 0],
        [1462492800000, 0],
        [1462406400000, 3]
      ]
    }, {
      name: 'sent',
      data: [
        [1464912000000, 40],
        [1464825600000, 50],
        [1465084800000, 60],
        [1462233600000, 20],
        [1459728000000, 20],
        [1459555200000, 10]
      ]
    }]
  });
});