Highcharts Demo

author(s): Torstein Hønsi

HTML

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

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

JavaScript

$(function () {
  Highcharts.chart('container', {
    chart: { type: 'area', },
    title: { text: 'Stacked Area Chart in Highcharts' },
    xAxis: { categories: ['2007','2008','2009','2010','2011','2012','2013','2014','2015','2016'] },
    plotOptions: {
      series: { 
        marker: { enabled: false }, stacking: 'normal'
      },
    },
    series: [
      { name: 'Total', type: 'line', data: [0,0.08,-0.31,-1.09,-1.82,-2.18,-2.49,-3.05,-3.12,-3.15] },  
      /* stack I items */
      { name: 'E', stack: 'I', data: [2, 1.5, 1.2,1,1,1,1,1,1,1] }, 
    /* { name: 'B', stack: 'I', data: [0,0.239857,0.637651,0.733988,0.85,0.855423,0.938974,0.912378,1.017854,0.985514] }, */
      /* stack II items */
      { name: 'G', stack: 'II', data: [-2, -1.5, -1.2,-1,-1,-1,-1,-1,-1,-1] },  
      /*{ name: 'F', stack: 'II', data: [0,0.029755,-0.45174,-0.397836,-0.61,-0.56368,-0.593108,-0.462725,-0.351842,-0.210976] }, 
      { name: 'D', stack: 'II', data: [0,-0.098096,-0.170803,-0.688206,-0.92,-0.918492,-0.876488,-0.967249,-0.954217,-1.029596] },
      { name: 'C', stack: 'II', data: [0,-0.096543,-0.271997,-0.512372,-0.70,-0.665893,-0.723534,-0.879249,-0.890587,-0.821584] },
      { name: 'A', stack: 'II', data: [0,-0.212001,-0.409192,-0.559879,-0.81,-1.089119,-1.313719,-1.606092,-1.808868,-2.041628] }*/
    ]
  })
});