You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
It would be nice if hover dataset mode could support an "unfocused" state for the non-hovered items (rather than just a "hovered" state for the hovered one). In particular, it's much easier to dim every other dataset than to somehow draw extra attention to the hovered one. See the example screenshot below.
It would also be nice if this could work in conjunction with hover.mode="index". In my case, I'd like to highlight the data points for the hovered index, and also dim out other datasets. Currently, using mode="dataset" will cause every point to be hovered. But using mode="index" allows no customization of the hovered dataset (only point).
Possible Implementation
I hacked together a plugin which uses getElementsAtEventForMode to find the active dataset, and modifies the background / border colors to dim out non-focused ones. However, it's hard to make this generic (supporting arrays, functions, values for borderColor/ backgroundColor, etc.). It also feels very hacky. I store the original background color, but I don't think it would work well if they change the color of the datasets themselves.
Essentially in afterEvent, I do something like this:
One other way this could be supported is using scriptable properties, i.e. borderColor: (ctx) => ctx.hovered ? regularColor : dimmedColor
There is something which almost works to support this today, which is ctx.active. There are two issues though:
You cannot detect if something else is active (in my case, I want to dim the non-active ones only if something else is active, ex. ctx.isActive || !ctx.hasActive ? regularColor : dimmedColor
It requires configuring the hover mode accordingly (i.e. mode: 'dataset'), which is an annoying coupling for me (I am using index mode currently for other purposes, such as tooltip)
Feature Proposal
It would be nice if hover dataset mode could support an "unfocused" state for the non-hovered items (rather than just a "hovered" state for the hovered one). In particular, it's much easier to dim every other dataset than to somehow draw extra attention to the hovered one. See the example screenshot below.
It would also be nice if this could work in conjunction with hover.mode="index". In my case, I'd like to highlight the data points for the hovered index, and also dim out other datasets. Currently, using mode="dataset" will cause every point to be hovered. But using mode="index" allows no customization of the hovered dataset (only point).
Possible Implementation
I hacked together a plugin which uses getElementsAtEventForMode to find the active dataset, and modifies the background / border colors to dim out non-focused ones. However, it's hard to make this generic (supporting arrays, functions, values for borderColor/ backgroundColor, etc.). It also feels very hacky. I store the original background color, but I don't think it would work well if they change the color of the datasets themselves.
Essentially in afterEvent, I do something like this:
The text was updated successfully, but these errors were encountered: