javascript - 如何在 Highcharts 中制作黑红线

Question

我正在使用Highcharts为我正在计算机化的生产区域制作图表的插件。

我制作了一个示例图的 jsFiddle:

http://jsfiddle.net/ericfarrow/j3s1xphu/1/

现在，正如您在这一行中看到的那样，它只是一条蓝色实线。

我的用户要求我拥有:

a) 向上倾斜的线条颜色为黑色
b) 向下倾斜的线条颜色为红色

显然，我可以将线条的默认颜色更改为黑色 - 但这也不能真正解决问题。

我检查了所有 Highcharts 文档，但找不到一种简单的方法来根据线条的 UP/DOWN 值动态地将线条从一种颜色更改为不同的颜色。

有人对此有什么想法吗？

或者也许有一个不同的插件可以提供此功能？

谢谢。

Answer 1

没有直接的方法可以做到这一点。

传统方法是使用两个不同的系列，如下所示:

series: [{
            id:'up',
            index:0,
            name: 'Phil',
            color:'rgb(0,0,0)',
            marker: { enabled: false },
            data: [[0,100.0], [1,800.0],[1.5,null], [2,400.5], [3,1200.5], [4,1450.2], [5,1805.0],[5.5,null], [6,600.2], [7,750.5], [8,945.3], [9,1000.3], [10,1305.9]]
},{
            id: 'down',
            name: 'down',
            linkedTo:'up',
            index:1,
            color:'rgb(240,0,0)',
            marker: { enabled: false },
            data: [[1,800],[2,400.5],[3,null],[5,1805],[6,600.2],[7,null],[10,1305.9],[11,1050.6]]
}]

示例:

• http://jsfiddle.net/jlbriggs/j3s1xphu/4/

还有一个插件看起来可以满足您的需求，在这里:

• http://www.highcharts.com/plugin-registry/single/33/Multicolor%20series