borntofrappe / learning-d3

d3.js is vast. Here's a repository filled with projects to master the library, its many modules and powerful features.
4 stars 0 forks source link

Legend Dispatching Component #38

Closed borntofrappe closed 1 year ago

borntofrappe commented 1 year ago

Create a component function to annotate a visualization with a legend.

As with previous component-based projects the function should add SVG elements on the current selection with the call method, group.call(legend).

From the component dispatch an event with d3.dispatch, for instance to highlight the visuals with the matching color.

borntofrappe commented 1 year ago

Small visualization with a side legend.

Legend

Highlight label and matching path element on hover.

Legend Highlight

The challenge is to repurpose the code for the legend into a component function.