Highcharts极坐标图栏中的“停止”？答案

【问题标题】："Stops" in Highcharts polar chart column?Highcharts极坐标图栏中的“停止”？
【发布时间】：2015-01-18 20:19:10
【问题描述】：

我们希望实现与“停止”相同的效果（就像在实心仪表中一样），我们可以在 Highcharts 极坐标图中为每列定义 0-5 为红色，6 和 7 为黄色，8 为绿色的值. 但是，我们尝试过的停止是为整个列显示与值无关的渐变。. 无法根据特定值为每列定义颜色。

到目前为止，我看到的唯一选项是直接根据数据设置颜色。此处示例：http://jsfiddle.net/buzLywrx/3/ 那就是：

data: [{ y: 8, color: 'green'}, { y: 7, color: 'green'}, { y: 6, color: 'yellow'}, { y: 5, color: 'yellow'}, { y: 4, color: 'red'}, { y: 3, color: 'green'}, { y: 2, color: 'red'}, { y: 1, color: 'red'}],

我们显示的是平均值，因此数据实际上可以是 0-100 之间的任何数字（带两位小数）。

根据值范围实现列颜色的最佳选择是什么？

【问题讨论】：

标签： highcharts visualization

【解决方案1】：

您可以迭代系列中的每个点并按条件更新颜色。

var color;
    $.each(chart.series[0].data, function(i, data){
        if(data.y<4) {
           color = 'red';
        } else if((data.y>4) && (data.y <6)) {
                color = 'yellow';
        } else if(data.y > 6) { 
                color = 'orange';
        }

        data.update({
                color: color
        });
    });

示例：http://jsfiddle.net/buzLywrx/4/

【讨论】：