How to create a line chart of temperature with gradient in react js

How can create chart like on Image?
I have ranges of temperatures:
0C to 100C range

Different colors for this range
10 – 40 Blue,
40 – 70 Yellow,
70 – 100 Red.
enter image description here

Data : x axis– 10, 20, 30, 50, 80, 20, 40, 30, 90, 10.
y axis– jan1, jan2, jan3, jan4, jan5 , jan6, jan7, jan8, jan9, jan10

I tried react apex charts but couldn’t get the colour gradient line to work exactly. Please let me know if you have any react models. 

Thanks