Javascript 列的正/负部分的不同颜色

我试图通过一个列范围图实现以下目标：

在api文档中，我找到了选项“negativeColor”（“图形中低于阈值的部分或点的颜色”），但该选项为整个列着色

是否有一种方法可以定义列的正部分应为“颜色”，负部分应为“负颜色”？

您可以这样做

$(document).ready(function() {

        var options = {
            chart: {
                renderTo: 'container',
                defaultSeriesType: 'bar'
            },
            title: {
                text: 'Spiritual Gifts Results'
            },
            colors: [
                '#3BBEE3'
                ],
            xAxis: {
                categories: []
            },

            yAxis: {
                title: {
                    text: 'Service'
                }
            },
            series: []
        };

        var data = document.getElementById("hdn_Data");
        // Split the lines
        if (data.value != "") {
            var lines = data.value.split('\n');

            // Iterate over the lines and add categories or series
            $.each(lines, function(lineNo, line) {
                var items = line.split(',');
                // header line containes categories
                if (lineNo == 0) {
                    $.each(items, function(itemNo, item) {
                        if (itemNo > 0) options.xAxis.categories.push(item);
                    });
                }
                // the rest of the lines contain data with their name in the first position
                else {
                    var series = {
                        data: []
                    };
                    $.each(items, function(itemNo, item) {
                        var data = {};
                        if (itemNo == 0) {
                            series.name = item;
                        } else {
                            data.y = parseFloat(item);
                            if (itemNo <= 3) { //Here to specify your mid value
                                data.color = 'Gray';
                            }
                            else {
                                data.color = '#3BBEE3';
                            }
                            series.data.push(data);
                        }
                    });
                    options.series.push(series);
                  }
                });

                // Create the chart
                var chart1 = new Highcharts.Chart(options);
            }
        });

$（文档）.ready（函数（）{
变量选项={
图表：{
renderTo:'容器'，
defaultSeriesType:'bar'
},
标题：{
文字：“精神礼物结果”
},
颜色：[
“#3BBEE3”
],
xAxis：{
类别：[]
},
亚克斯：{
标题：{
文本：“服务”
}
},
系列：[]
};
var data=document.getElementById（“hdn_数据”）；
//分道扬镳
如果（data.value！=“”）{
变量行=data.value.split（'\n'）；
//迭代行并添加类别或系列
$.each（行，函数）（行号，行）{
var items=line.split（'，'）；
//标题行包含类别
如果（行号==0）{
$。每个（项目，功能（项目编号，项目）{
if（itemNo>0）options.xAxis.categories.push（项目）；
});
}
//其余行包含名称位于第一个位置的数据
否则{
变量系列={
数据：[]
};
$。每个（项目，功能（项目编号，项目）{
变量数据={}；
如果（itemNo==0）{
series.name=项目；
}否则{
data.y=parseFloat（项目）；
如果（itemNo不使用columnrange，请使用简单的堆叠列系列，一个系列为负值，第二个系列为正值。
请参阅此链接……使用稍微不同的方法如何？使用两个标准的列系列代替columnrange。然后设置堆叠，即可完成。或者使用渐变：（注意-渐变是以像素为单位设置的，因此它只适用于具有固定高度的图表）。Pawel，你是一个和蔼可亲的、堆叠的标准柱，工作非常完美！非常感谢！不幸的是，我无法更新你的评论：（太感谢你了，非常有趣的解决方案！