Use hsl. This makes things SO much easier in cases like this.
in hsl, red is 0, blue is ~240.
let's use farenheit for the example, and map 0°f to hsl 240, 100°f to hsl 0.
make a label, and put a custom property on it. Let's call it "temp" (you should probably pick a better name, to reflect that it represents a hue, but I didn’t think it through and called it temp).
Put an expression binding on this custom prop, that will look like this: 240 - (240 * ({../Slider.props.value} / 100))
I used a slider to test it, replace it with your actual temperature source (probably a tag).
Now add a backgroundColor style to your label, and put an expression binding on it as well.
The expression should look like this: 'hsl(' + {this.custom.temp} + ', 50%, 50%)'
You'll have to adapt the values in the temp expression to match the unit and range, or maybe even the formula to change the curve,
and you can also play on the saturation and lightness in the hsl function to get the result you want.
Noah, I made the same mistake on first reading: the question isn't how to generate the heat scale, it's how to pick a color from the scale to apply to various labels on the view so that, for example, any reading about 45°C will have yellow background.
It will give an abrupt change in color at certain points.
Disadvantages:
Abrupt color change.
If you want to adjust the range (20° to 60° in your example) then you'd have to edit all the color maps. This would be a bit painful.
The Map input type does take an expression so you could reference some temperature limits to determine which band you're in. I didn't try it.