HighCharts创建条状渐变颜色以使条形图上的每个值变得模糊

Question

我正在尝试创建一些具有较高倾斜度的高购物车栏 条形减少每个范围的颜色，对于等级1条，颜色是纯色

这是我的示例图片

任何人都可以帮助我

Answer 1

您可以通过包装colum的原型来使用colorAxis系列中的heatmap：

var columnProto = Highcharts.seriesTypes.column.prototype;

columnProto.axisTypes = ['xAxis', 'yAxis', 'colorAxis'];
columnProto.optionalAxis = 'colorAxis';
columnProto.colorKey = 'y';

Highcharts.wrap(columnProto, 'translate', function(proceed) {
    proceed.apply(this, Array.prototype.slice.call(arguments, 1));

    Highcharts.seriesTypes.heatmap.prototype.translateColors.call(this);
});

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

实时演示： http://jsfiddle.net/BlackLabel/u8wgh0dk/

API参考： https://api.highcharts.com/highcharts/colorAxis