如何在Highcharts中为区域边界实现纯色？

Question

我在Highcharts中设置了一个不同颜色的折线图，表示值达到了不可接受的高值（95％或以上）。

为实现这一目标，我在系列配置中添加了区域，如下所示：

zones: [{
    value: 95,
    color: 'lightblue'
}, {
    color: 'red'
}]

一个蓝色区域包含最多95个值，另一个红色区域显示更高的值。

似乎当值接近95时，线条开始变为红色，这意味着在线条接近但从未达到95％的图表上，线条显示（部分）红色。

我想阻止这种情况，只有当值达到95％时才会将该线变为红色。有没有办法做到这一点？

Here是一个显示问题的演示。谢谢！

Answer 1

这是一个棘手的问题。

首先，您的数据看起来像一条直线，非常接近 95 。在这些情况下，使用zones属性的颜色重叠是不可避免的。

但是你可以尝试一些技巧;

Highcharts有一个名为 MultiColor 的插件，您可以找到here。

使用此插件，您可以创建多色折线图;

我们可以为您的图表做的是修改数据以包含颜色，

data: [94.0, 94.1, 94.2, 94.3, 94.4, 94.5, 94.6, 94.7, 94.8, 94.9, 94.8, 94.7, {y: 95.0, segmentColor: 'red'},{y: 95.4, segmentColor: 'red'}, {y: 96.1, segmentColor: 'red'}]

此修改将提供我们要求的结果：

实例：jsFiddle。