CODEWITHSUNDEEP
highcharts
key
key

Reputation: 69

Highcharts: is there a way to offset lines slightly so same coordinates do not overlap?

I have a line chart with a limited Y axis (1-5). There are six different lines represented on the chart (3 each from two different users: measuring feeling 1, feeling 2 and feeling 3 from 1-5).

When users enter the same value over time (for instance, ranking feelings 1 and 2 as 5 for several weeks), the two lines completely overlap and you can only see one.

Is there a way I can offset a particular line by say, a couple pixels up and to the right so if there are two different lines representing same values over time, I can see both at once?

Upvotes: 1

Views: 1576

Answers (1)

Kacper Madej
Kacper Madej

Reputation: 7886

Using pointPlacement it is possible to slightly offset each series, so points with the same values do not overlap each other. The tooltip will still work as if points would overlap, so setting shared to true should help.

Example: https://jsfiddle.net/BlackLabel/3mhyojtd/1/

Another option that will allow not shared tooltip would be to use scatter type series with lineWidth set to 2, to imitate line type series.

Example with scatter series: https://jsfiddle.net/BlackLabel/r6pL4f2j/

Upvotes: 3

Related Questions