Highcharts Stock Demo

author(s): Torstein Hønsi

HTML

<div id="container" style="height: 400px; min-width: 600px"></div>

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

JavaScript

$(function(){

window.myChart = new Highcharts.Chart({
      chart: { 
        renderTo: 'container',
        events: {
          load: function(event) {
            if(this.series[0].data.length == 0)
              this.showLoading('No data to display');
          }
        }
      },
      
      title: null,
      tooltip: {
        formatter: function() {
            return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
         }
      },
      plotOptions: {
        pie: {
          allowPointSelect: true,
          cursor: 'pointer',
          dataLabels: {
             enabled: true,
             formatter: function() {
                return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
             }
          }
        }
      },
      series: [{
        id: 'pie',
        type: 'line',
        name: 'Composition',
        data: [[],[]]
      }]
    }, function(chart){
        setTimeout(function(){
            chart.get('pie').setData([ [], ['Second record', 20.5] ], true);
        }, 2000);
    });
});