Highcharts Demo

author(s): Torstein Hønsi

by Mi Ku

HTML

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

JavaScript

var chart = new Highcharts.chart('container', {
  chart: {
    type: 'column'
  },
  yAxis: {
  	plotBands: [
                    {
                        from: 0,
                        to: 2000,
                        color: 'rgba(154, 154, 154, 0.25)',
                        label: {
                            align: 'right',
                            verticalAlign: 'middle',
                            text: 'AVG',
                            style: {
                                fontSize: '12px',
                                fontWeight: '300',
                                color: '#808080'
                            },
                            y: 0,
                            x: 25
                        },
                        events: {
                          mouseover: function(e) {
                              chart.tooltip.refresh('some text');
                          },
                          mouseout: function(e) {
                              console.log('mouseout');
                          }
                			}
                    }
                ]
  },
  tooltip: {
    formatter: function() {
        return 'Show me on hover in a tooltip';
    }
  },
  series: [{
    data: [4393, 3250, 5717, 6965, 7031, 1993, 3713, 5417]
  }],
});