Chartjs-Chart.js Partly filled in area/line graph

I also encountered this problem recently and solved it using a solution similar to yours.

Unfortunately in Chart.js there is no easy way to set the chart background color based on the zone.

Solution.
The solution I adopted was to create a dataset for each color I wanted to
use in the chart.

Another solution that I tried but was less satisfying is to create a bar chart, whose height of the bars was equal to the height of the chart so I could color the entire area.