NateBaldwinDesign
commented
3 years ago @DmitryBaranovskiy I've also noticed an odd shift that's happening in HSLuv interpolation with the new Chroma-plus. Directionality of the polar interpolation is reversed from its original direction (in existing Leonardo).
For example, when creating a scale using CSS colors 'yellow' (#ffff00) and 'navy' (#000080), the current d3 interpolation in Leonardo traverses through cool colors:
The update, using the same key colors yellow and navy, traverse through warm colors (opposite directionality):
Both d3-color and chroma.js determine which direction to interpolate (in polar space) based on closest distance. Just to be safe, I've compared the two libraries conversion of #ffff00 and #000080 to confirm that their hsluv values are identical (rounded): |
Color name | Hex | d3-hsluv | chroma-plus hsluv |
|---|---|---|---|---|
| Yellow | #ffff00 |
hsluv(86,100,97) | hsluv(86, 100, 97) | |
| Navy | #000080 |
hsluv(266,100,13) | hsluv(266, 100, 13) |
What this appears to be is that these colors lie directly on the threshold of when directionality should shift: The hues are exactly 180 degrees apart. (266 - 86 = 180).
This won't be an issue in reviewing/accepting this PR, however I'm making a note of it here for record. I will need to ensure this is communicated when we publish this update. I believe it's reasonable to inform users that if this happens, they should modify one of their key colors hues to be one degree more or less (in the respective colorspace) in order to force interpolation direction to reverse.
Although, this makes me wonder if we should enable a directionality shift parameter to the scales, such as how d3-interpolate offers a "long" option (color.interpolateHcl() and color.interpolateHclLong()): https://github.com/d3/d3-interpolate#interpolateHcl
Description
Speed improvements, ESLint integration, general cleanup.
Motivation
Beauty all around
To-do list