Test stacked columns with mixed values

author(s): Mike Zavarello

by Mike Zavarello

HTML

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

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

JavaScript

Highcharts.seriesTypes.area.prototype.negStacks = true;
//Highcharts.seriesTypes.area.prototype.getStackPoints = Highcharts.seriesTypes.area.prototype.getValidPoints;
Highcharts.chart('container', {
  chart: {
    type: 'area'
  },
  title: {
    text: 'Test stacked columns with mixed values'
  },
  xAxis: {
    categories: ['2017','2016','2015','2014','2013','2012','2011','2010','2009','2008'].reverse()
  },
  credits: {
    enabled: false
  },
  series: [{
    name: 'Rate', color: '#0E4768', zIndex: 4,
    data: [0.285,0.104,0.042,0.149,0.166,0.263,0.157,0.073,0.101,0.000].reverse(), type: 'line'
  }, {
    name: 'Behavior', color: '#F5892F', //stack: 'b',
    data: [0.005,-0.126,-0.156,-0.025,0.034,0.162,0.050,-0.002,0.058,0.000].reverse(), type: 'column', stacking: 'normal'
  }, {
    name: 'Demographics', color: '#768F40', //stack: 'a',
    data: [0.280,0.230,0.199,0.175,0.132,0.102,0.107,0.075,0.043,0.000].reverse(), type: 'column', stacking: 'normal'
  }]
});