observablehq
Interactive legends
It would be great to have interactive legends
There are many interaction patterns where the user interacting with the legend is most intuitive, e.g.:
-
legend represents the mapping of categories to colors --> user may want to unselect/ select categories by clicking on the corresponding color/category in the legend --> user may want to change color mappings by clicking on the colors
-
legend represents the mapping of intervals to colors --> user may want to change the interval ranges which would update the Plot
Is it planned the legends will become interactive at one point? Or will the legends remain static and the recommendation is e.g. to build custom Inputs on observable for that?
It's not planned in the short run, but contributions and experiments are welcome. You can use the chart.scale method to retrieve the scale and create an interactive widget that in turn will make changes to some global state that controls the chart definition?
See @tophtucker 's experiment https://observablehq.com/@tophtucker/interactive-plot-legend
Interaction, in general, is essential for exploratory data analysis. Often, programmers can't anticipate the questions people will raise when reviewing data dashboards, presentations, etc. So, adding interactive filtering, slicing, etc., will open doors for real-time exploration.
For comparison, Altair supports interactive legends, selection, and cross-filtering.
- https://altair-viz.github.io/gallery/interactive_legend.html
- https://altair-viz.github.io/gallery/selection_layer_bar_month.html
- https://altair-viz.github.io/gallery/interactive_layered_crossfilter.html
Just dropping in to say "I'm begging you,,, please ADD INTERACTIVE LEGEND"
I was looking for this functionality and landed here. It turns out we can do this by adding some click handlers to elements in the legend and dispatching an event to trigger a cell refresh.
The end result works quite well: https://observablehq.com/d/7f906c970a3f4e09
