threshold between 3 color in line charts of highcharts

Question

I have to do a line charts with threshold y=5 where y>5 circle color is green y<5 circle color is red and circle y=5 circle color is orange. Using simple threshold i can draw only 2 color in red and green but i can't do the orange one.

{ name: 'Series1', data: [ {y:2}, {y:6}, {y:5}, {y:6.5}, {y:3}, {y:10} ], threshold: 4, negativeColor: "red", color: "green" }

How can i do my chart with 3 color circle using threshold? and how can i take color only in circle but grey in line connected circle?

Answer 1

To do what you are asking will require using multiple series, as in this example:

• http://jsfiddle.net/jlbriggs/yHn2D/

You can use the linkedTo property to make them all sit under one legend entry. However, this kind of display inevitably leads to a a cluttered, overly colored, hectic display.

My example, even though the colors are toned down, looks a bit circus-like.

I would be much more inclined to do soemthing like this:

• http://jsfiddle.net/jlbriggs/yHn2D/3/

Highlight the target range on the chart, in a subtle manner. When looking at such a chart day after day, watching for data that is outside of the acceptable range, a chart like this will make it very easy to see.

A chart that highlights every singly point, with multiple colors, whether they require attention or not, will drown the important information in visual clutter.

FWIW.