Highcharts bar chart with bar colored based on value

Question

I am looking for a way to create a bar chart where bars change color from light to dark depending on their value (length) as in following example:

Answer 1

Color can be set per point, so you could calculate what color a point should have and set it through data in chart's options.

$(function() {
  var data = [1, 2, 3, 4, 5, 6, 7, 8, 9];
  Highcharts.each(data, function(point, i) {
    data[i] = [point, '#f' + point + '0'];
  });
  $('#container').highcharts({
    series: [{
      type: 'bar',
      data: data,
      keys: ['y', 'color']
    }]
  });
});

JSFiddle: http://jsfiddle.net/w8c8fxju/

Update: Color axis could be used.

Highcharts.chart('container',{
    colorAxis: {
        minColor: '#4f4',
        maxColor: '#060'
    },
    series: [{
        type: 'bar',
        data: [1, 2, 3, 4, 5, 6, 7, 8, 9]
    }]
});

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/coloraxis.js"></script>
<div id="container" style="height: 400px"></div>