Highcharts Demo

author(s): Torstein Hønsi

by glittle

HTML

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

<div id="container" style="height: 400px"></div>
<div id="report"></div>

JavaScript

var chart1;
    var data = [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4];
    // create the chart
    var options = {
      chart: {
        renderTo: 'container',
        events: {
          selection: function(ev) {
            //setTimeout(function(){
              chart1.destroy();
              data.splice(0, 2);
              chart1 = new Highcharts.Chart(options);
            //}, 0);
            ev.preventDefault();
          }
        },
        resetZoomButton: {
          theme: {
            display: 'none'
          }
        },
        zoomType: 'x'
      },
      title: {
        text: 'Recreating on zoom'
      },
      subtitle: {
        text: 'Click and drag the plot area to zoom'
      },

      series: [{
        type: 'column',
        data: data
      }]
    };


    $(function() {
      chart1 = new Highcharts.Chart(options);
    });