Highcharts Demo

author(s): Torstein Hønsi

by Pawan Jadhav

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-3d.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

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

CSS

#container,
#sliders {
  min-width: 310px;
  max-width: 800px;
  margin: 0 auto;
}

#container {
  height: 400px;
}

JavaScript

$(function () {
  // Set up the chart
   $('#container').highcharts({
    "chart": {	
      plotBorderWidth : 1
    },
    "title": {
      "text": ''
    },
     
    
   
    "xAxis": {
      "categories": ["Consumer", "Corporate", "Home Office", "Small Business"]
    },
    "yAxis": [{
      "opposite": false,
      "maxPadding": 0,
      "minPadding": 0,
      "plotLines": [{
        "value": 200,
        "zIndex": 5,
        "dashStyle": "Solid",
        "width": 1,
        "color": "#000000",
        "label": {
          "text": "Marker aa211o00",
          align : 'right',
          x:0,
          y:0,
          "style": {
            "color": "#000000",
            "font-size": "1.143rem",
            "font-family": "Lucida Sans Unicode"
          }
        }
      }],
      "plotBands": [],
      "tickInterval": null
    }],
    "series": [{
      "type": "column",
      "yAxis": 0,
      "data": [{
        "y": 247
      }, {
        "y": 294
      }, {
        "y": 267
      }, {
        "y": 148
      }]
    }]
  });


});