search

susielu / d3-legend

A reusable d3 legend component.
http://d3-legend.susielu.com/
Apache License 2.0
727 stars 104 forks source link

Ensure legend construction is idempotent #16

Closed ColinEberhardt closed 9 years ago

ColinEberhardt commented 9 years ago

Thanks for this amazing component - really well designed. I love the idea of constructing the legend directly from a scale.

The reason I am looking for a legend is because I am currently involved with d3fc, where we are trying to build a more component-based charting library. I was about to build my own svg legend when I stumbled upon your project. You can see an example of the d3fc approach here:

http://d3fc.io/examples/scatter/

Anyhow, I'd love to integrate your legend with out charting components.

One issue I did spot is that your legend is not idempotent. If you call it multiple times on a selection, the legend is duplicated:

svg.select(".legendSymbol")
  .call(legend);

svg.select(".legendSymbol")
  .call(legend);

If you try the same with d3's axis, it is only rendered once, with subsequent 'calls' resulting the the existing axis being updated.

This PR modified the legend construction to use a data-join so that it is idempotent.

Thanks, Colin E.

susielu commented 9 years ago

Thanks for the detailed post and for making a pull request!