basic example

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="height:400px;margin:1.5em 1em;"></div>

JavaScript

$(function() {

  $('#container').highcharts({
    chart: {
      type: 'column',
      renderTo: 'container'
    },
    title: {
      text: 'Daily Events',
      style: {
        'color': '#06F',
        'font-family': 'Roboto',
        'font-size': '16px',
        'font-weight': 'bold'

      },
      useHTML: true
    },
    xAxis: {

      categories: [
        '1',
        '2',
        '3',
        '4',
        '5',
        '6'
      ],
      min: 0,
      max: 5
    },

    yAxis: {
      min: 0,
      title: {
        text: 'No. of Events'
      },

      stackLabels: {
        enabled: true,
        style: {
          fontWeight: 'bold',
          color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
        }
      }
    },
    legend: {
      itemStyle: {

        'color': '#666',
        'font-family': 'Roboto',
        'font-weight': 'normal',
        'font-size': '11px'

      },

      useHTML: true
    },
    tooltip: {
      formatter: function() {
        return '<b>' + this.series.name + '</b><br/>' +
          this.x + ': ' + this.y;
      }
    },
    plotOptions: {
      column: {
        pointWidth: 30,
        stacking: 'normal',
        dataLabels: {
          enabled: true,
          color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
          style: {
            textShadow: '0 0 3px black'
          }

        }
      }
    },

    series: [{
      name: 'Incoming',
      data: [{
          y: 10.4,
          color: '#FAA961'
        }, //incoming
        {
          y: 15.4,
          color: '#FAA961'
        }, {
          y: 20.4,
          color: '#FAA961'
        }, {
          y: 12.4,
          color: '#FAA961'
        }, {
          y: 30.4,
          color: '#FAA961'
        },
      ],
      color: '#FAA961'
    }, {
      name: 'Ongoing',
      data: [{
          y: 10.4,
          color: '#438EF7'
        }, //incoming
        {
          y: 15.4,
          color: '#438EF7'
        }, {
  ...