fix: extend d3-interpolateRgb() to process CSS vars

[ildar170975]

Seems that an external d3-interpolateRgb() does not process CSS variables like var(--green-color).
The d3-interpolateRgb() function is replaced with a proxy function which converts CSS variables to values.
Will hopefully solve #1259.

[akloeckner]

I'm not sure, if we should do this. When I added d3, using a hidden element was an option for interpolation, too. I explicitly chose to not do it. I don't fully recall the reasons. I think, it was somehow considered unstable. And even after adding the small d3 library, it was criticized for introducing a dependency.

So, I think our options are:

• Choose to not support css variables.
• Switch the entire interpolation to css hidden elements. That way we would support the full css language. Because the next thing will be someone requesting to use mixed colors or the likes.

[ildar170975]

Thanks a lot for the feedback!!! Converting to draft, will think about it later.

[ildar170975]

• Switch the entire interpolation to css hidden elements

This is unclear for me, will check your previous posts to understand the point.

• Because the next thing will be someone requesting to use mixed colors or the likes.

BTW, interpolateRgb first converts a color before processing, different formats seem to be supported.
https://github.com/d3/d3-color/blob/71c7f100f9fa85a1c70fcbaeb5f803ee8db5620d/src/color.js#L201

criticized for introducing a dependency.

I introduced a separate file "interpolateRgb.js" exactly to REPLACE a dependency in some future.

[akloeckner]

Switch the entire interpolation to css hidden elements

We could also set some colour property on the element, using mix-ins. And then retrieving that colour property will return the interpolated value as RGB. See the second example here: https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration/getPropertyValue#examples .

Or we could declare the colour of each bar not as hex directly, but as mix-in string.

The first variant is the somehow unstable one I tried to avoid. The second variant might be elegant, because we could get rid of the JS interpolation altogether.

[akloeckner]

PS, looking at the issue now: #1259 (comment)

The graph itself does render the variables correctly, because it uses the colours in a map directly. So it basically relies on the browser for interpolating. The points, however, and bars are interpolated in JS.

[ildar170975]

OK, some info to be processed...