根据HighCharts中的值更改样条线的颜色

时间:2013-02-05 20:20:27

标签: highcharts

我可以根据标记颜色是高于(红色)还是低于(绿色)还是介于(黄色)之间来更改标记颜色,但不能更改标记之间的线条颜色。这可能吗?现在,它只显示为蓝线。

function makeRun(divId, last, current, goal, title, yAxisTitle) {
    var width = 1000; var SizeOfFont = '14px';
    var min = checkMinMaxArray(current, last, goal, 'min') * 995 / 1000; //sets min closely below the real min. **consider changing to 4/5 digits**
    var max = checkMinMaxArray(current, last, goal, 'max') * 1005 / 1000; //sets max closely above the real max

    //if there are projections, color code the columns here
    preprocessData = function (data, last, goal) {
        var nData = [];
        var colorGood = 'green'; var colorBad = '#E42217'; var colorUse;
        for (var i = 0; i < data.length; i++) {
            if (data[i] <= goal[i]) { colorUse = colorGood; }
            else if (data[i] > last[i]) { colorUse = colorBad; }
            else { colorUse = '#FFE303'; }
            nData.push({
                y: data[i],
                x: i,
                fillColor: colorUse,
                color: colorUse
            });
        }
        return nData;
    };

    var chart = new Highcharts.Chart({
        chart: {
            renderTo: divId,
            height: 275, //little bigger than alotted height to make more readable
            width: width //dependent on #gauges
        },
        title: {
            text: title, //should all be the same, can make a parameter if need to be different
            style: { //size of text above
                fontSize: SizeOfFont
            }
        },
        xAxis: {
            //categories: xAxisTitles,
            labels: { //size of the Text above^^
                style: {
                    fontSize: SizeOfFont
                }
            }
        },
        yAxis: {
            min: min,
            max: max,
            title: {
                text: yAxisTitle, //parameter since some are days, percents, etc
                style: {//size of y axis title
                    fontSize: SizeOfFont
                }
            },
            labels: {
                style: {//size of the y axis tick labels
                    fontSize: SizeOfFont
                }
            }
        },
        credits: {//gets rid of the highcharts logo in bottom right
            enabled: false
        },
        legend: {//the legend at the bottom
            style: {
                fontSize: '12px'
            }
        },
        series: [{
            type: 'spline',
            name: '2012',
            data: last,
            color: 'orange',
            marker: {
                symbol: 'diamond'
            }
        }, {
            type: 'spline',
            name: '2013',
            data: preprocessData(current, last, goal),
            marker: {
                symbol: 'diamond'
            }
        }, {
            type: 'spline',
            name: 'Goal',
            data: goal,
            color: 'blue',
            marker: {
                symbol: 'diamond'
            }
        }]
    });
}

1 个答案:

答案 0 :(得分:0)

在一个系列中,你不可能准备两个不同颜色的独立系列。