I have an SVG tank vessel.
I am able to set fill color.
Instead of filling color discreet. (90=orange 100=red)
I want to fill color continuously. where 95 will be somewhere between orange and red.
I want to convey the inside pressure of tank by the fill color (best if gradient)
For the style:
Can you create a function that takes in analog value of 0-100 and outputs a color from white to red?
def transform(self, value, quality, timestamp):
gb = int(255 * (1 - value / 100.0))
return '#%02X%02X%02XFF' % (255, gb, gb)
It doesn't really ever go orange, but it goes white to red.
This seems worse than having a few discrete steps in there, the differences are hard to recognize.
You could have an expression return a value for the background style property that uses an hsl string to return a color:
E.X, this does the opposite of what you want but:
stringFormat(
"hsl(0, 100%%, %s%%)",
min({this.props.value} + 50, 100)
)
When the input is 0, the output is pure red:
When the input is 100, the output is pure white:
Both Work Perfectly.
Thanks.
