Feature Request: Fill thresholds (horizontal-banded gradient)

[raffertyp1]

I saw that you had previously experimented with applying gradients to the fill, but ultimately decided against it (your post: https://community.home-assistant.io/t/lovelace-mini-graph-card/71385/184).

In that setup, the gradient changes were displayed as vertical bands (matched to x-axis values), which is why it may look a bit strange.

I'd like to request horizontal bands (matched to y-axis values) that mimics the line color thresholds. See the example below.

If I was giving my full wishlist, I'd ask for an option to hide the line and only show the fill, but I'll open a separate issue for that :)

[raffertyp1]

As another example, here is a codepen that I forked with a simpler color scheme:
https://codepen.io/anon/pen/jjzWJq

[kalkih]

Yeah, I experimented with that prior to the rework of color thresholds (thresholds are now rendered along the Y-axis, instead of the x-axis).

Could give it another shot now when the thresholds are rendered differently, should work/look better.
Might be problematic when combined with the fill: fade option, can't guarantee it will work when used with that option.

Feel free to open another issue for the "hide line" request 👍

[kalkih]

This is now available in the latest release 🎉