Highcharts Stock Demo

author(s): Torstein Hønsi

by arjunasuresh3

HTML

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

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

JavaScript

var requestSent = false;
Highcharts.chart('container', {
  chart: {
    type: 'column',
    events: {
      redraw: function(event) {
        if (this.xAxis) {
          var extremes = this.xAxis[0].getExtremes();
          if (extremes && extremes.max == extremes.dataMax) {
            if (!requestSent) {
              requestSent = true;
              var series = this.series[0];
              series.addPoint(["Adapt chart height to legend height" + (new Date()).getTime(), 278], false, false);
            }
            console.log("time to load more data!");
          }
        }
      }
    }
  },
  title: {
    text: 'Most popular ideas by April 2016'
  },
  xAxis: {
    type: 'category',
    title: {
      text: null
    },
    min: 0,
    max: 4,
    scrollbar: {
      enabled: true
    },
    tickLength: 0
  },
  yAxis: {
    title: {
      text: 'Votes',
      align: 'high'
    }
  },
  legend: {
    enabled: false
  },
  credits: {
    enabled: false
  },
  series: [{
    name: 'Votes',
    data: [
      ["Gantt chart", 1000],
      ["Autocalculation and plotting of trend lines", 575],
      ["Allow navigator to have multiple data series", 523],
      ["Implement dynamic font size", 427],
      ["Autocalculation and plotting of trend lines", 575],
      ["Allow navigator to have multiple data series", 523],
      ["Implement dynamic font size", 427],
      ["Multiple axis alignment control", 399],
      ["Stacked area (spline etc) in irregular datetime series", 309],
      ["Adapt chart height to legend height", 278],
      ["Export charts in excel sheet", 239],
      ["Toggle legend box", 235],
      ["Venn Diagram", 203],
      ["Add ability to change Rangeselector position", 182],
      ["Draggable legend box", 157],
      ["Sankey Diagram", 149],
      ["Add Navigation bar for Y-Axis in Highstock", 144],
      ["Grouped x-axis", 143],
      ["ReactJS plugin", 137],
      ["3D surface charts", 134],
      ["Draw lines over a stock chart, for analysis...