• Open in:

Line with Different Colors for Ups and Downs

Sometimes it’s great to emphasize the trend in data by coloring the line according to the direction of value changes.

Key implementation details

The key here is “massaging” the data to add a color field according to the trend. Then we can use that data field in the strokes.template for the series.

Additionally, we adjust the tooltip background color each time tooltip position changes using the color from the data item it’s pointing to.

Related tutorials

Demo source