Add `above` and `below` line color options (similar to fill origin)

[rabbitgomes7]

Feature Proposal

I'm using Chart.js to plot data that can fluctuate above or below zero. Currently, I can easily create an area chart and color the fill based on whether a point is above or below the origin by using:

fill: {
target: 'origin',
above: 'rgba(16, 185, 129, 0.2)',
below: 'rgba(244, 63, 94, 0.2)',
}

This is a great feature because it automatically splits the fill color. However, if I also want to add a line/border to that area, it suddenly becomes much more complicated.

Why not implement the same logic for the border color, something like:

borderColor: {
target: 'origin',
above: 'rgba(16, 185, 129, 0.2)',
below: 'rgba(244, 63, 94, 0.2)',
}

Possible Implementation

No response

[FabTechAT]

Here's a polyfill: https://jsfiddle.net/1bd2570y/

edit: nevermind, doesn't work if lines cross between segments