fix(axe-os): stop the chart stacking a fill per series - #1979
SurefireStudios wants to merge 2 commits into
Conversation
createChartDatasets passes the same `fill` flag to every series in a group, so a group with four supported sensors drew four translucent washes on top of one another. The stacked alpha made the y1 area read as a solid block rather than a chart. Only the leading series in a group is filled now. The second axis also took textColorSecondary for its series and 'black' as its mix colour, so on the dark theme the trailing series were mixed toward the background and became hard to separate. Adds --chart-axis2-color and mixes toward the main text colour instead, with the axis ticks matching the series they scale.
|
nack in current form, it should pick one of the active datapoints to fill instead of just the furst |
Per review: picking index 0 meant that hiding that series from the legend left the group with no fill at all, rather than moving the fill to a series still on screen. The fill target is now the first entry whose `hidden` is false. The legend toggles `hidden` in place without rebuilding the datasets, so refreshChartFill re-picks the target on toggle and calls ci.update() to repaint. Colour assignment still keys off the original index, so a series keeps its colour regardless of what is hidden.
|
Good catch. With Now picks the first entry with |
Split out of #1977 at @0xf0xx0's request — no colour-meaning changes here, just the chart.
Stacked fills
createChartDatasetspasses the samefillflag to every series in a group:backgroundColoriscolor-mix(in srgb, ${borderColor}, transparent 81%)— 19% opacity. With four supported sensors in a group that is four washes drawn on top of each other, and the stacked alpha makes the y1 area read as a solid block rather than a chart. Boards with fewer sensors show it less, which is probably why it survived.Only the leading series in a group is filled now. One line:
Second axis colour
Separately, the y2 group was built with
textColorSecondaryas its base and'black'as its mix colour:On the dark theme that mixes each trailing series toward the background, so the further down the group a sensor sits the closer it gets to invisible. Adds
--chart-axis2-color, mixes toward--color-text-maininstead, and points the y2 tick colour at the same variable so the axis matches the series it scales.If you would rather take only the fill fix and leave the axis colour alone, say so and I will drop the second half — they are independent.
Verified
npm run buildinmain/http_server/axe-oscompletes clean on Node 24 / Angular 19.Before / after
Those show the axis change: the right-hand scale and the ASIC Temp legend swatch go from the same grey as the gridlines to the group's own colour.
They do not show the fill change, and I would rather say so than imply otherwise — the shots are rendered against the fixture in
home.component.spec.tswith the API stubbed, and I could not get the stub to feed the three rolling averages data that diverges from the raw figure, so only one series is drawn in both. On a device the four differ and the stacking is what you see.--chart-axis2-colorfalls back to--color-text-secondarywhen unset, so a theme that does not define it renders exactly as today.