Live data from Hacker News

Legends in D3

d3-legend.susielu.com

11–20 of 22 posts

Re: Legends in D3

#12
A team I work with built a great internal tool with D3 and there were a few things that they did that really bumped it up to the next level:

- The data was the interface. Things that they used d3 to show, were also the interaction elements which could be clicked to focus-in on subsets of the same data. It was almost fractal, but also immediately clear and simple to use. There were no control bars or sliders or really buttons. Anybody who could use google maps could use this and it took about 10 seconds to show somebody how it worked before they could operate it at a high-level.

- The legend was not just a visual aid, but had interactive components in the tool:

1) Hovering over an element in the legend caused all the corresponding elements in the display to highlight so you could see where they were in a complex display. (and visa-versa, hovering over an element in the main display caused that element in the legend to highlight)

2) Clicking an element in the legend caused it to filter on-off, allowing various unimportant parts of the display to be eliminated.

These three things changed it from just a static picture into a useful analytic tool and getting more value out of the legend by turning it from just a picture into a fully interactive element felt so obvious in retrospect that legends I see now that are just a legend feel incomplete.

Re: Legends in D3

#13

"Tired of making legends for your data visualizations?" No. It never takes more than about two minutes to whip up something basic like this. Integrating your legend tightly with your visualization has lots of benefits, mostly in terms of enabling interaction.

Good for you. For me it would take close to a working day at least the first time. Later on, maybe an hour if I am lucky.

Re: Legends in D3

#14
post #12

A team I work with built a great internal tool with D3 and there were a few things that they did that really bumped it up to the next level: - The data was the interface. Things that they used d3 to show, were also the interaction elements which could be clicked to focus-in on subsets of the same data. It was almost fractal, but also immediately clear and simple to use. There were no control bars or sliders or really…

This really reminds me of toggling legend in Rickshaw. http://code.shutterstock.com/rickshaw/examples/extensions.ht...

Re: Legends in D3

#16
post #12

A team I work with built a great internal tool with D3 and there were a few things that they did that really bumped it up to the next level: - The data was the interface. Things that they used d3 to show, were also the interaction elements which could be clicked to focus-in on subsets of the same data. It was almost fractal, but also immediately clear and simple to use. There were no control bars or sliders or really…

This really reminds me of toggling legend in Rickshaw. http://code.shutterstock.com/rickshaw/examples/extensions.ht...

Yeah, the legend works very similarly in the one I saw as well.

Re: Legends in D3

#17

"Tired of making legends for your data visualizations?" No. It never takes more than about two minutes to whip up something basic like this. Integrating your legend tightly with your visualization has lots of benefits, mostly in terms of enabling interaction.

Something you make in two minutes enables more interaction than this solution? I must work at a very slow pace...legends take me longer than I'd like to admit.

Re: Legends in D3

#18
I can't be the only one who thought this article would be about people who will be known throughout history for their amazing work in D3- champions, heroes, front-end developers!

Re: Legends in D3

#19
post #12

A team I work with built a great internal tool with D3 and there were a few things that they did that really bumped it up to the next level: - The data was the interface. Things that they used d3 to show, were also the interaction elements which could be clicked to focus-in on subsets of the same data. It was almost fractal, but also immediately clear and simple to use. There were no control bars or sliders or really…

It's fairly easy to do with a little bit of additional d3 code. It'd be nice for the lib to support it, however.

https://vida.io/documents/jspBB83bm6EvEYE3n

Re: Legends in D3

#20
post #12

A team I work with built a great internal tool with D3 and there were a few things that they did that really bumped it up to the next level: - The data was the interface. Things that they used d3 to show, were also the interaction elements which could be clicked to focus-in on subsets of the same data. It was almost fractal, but also immediately clear and simple to use. There were no control bars or sliders or really…

A d3 wrapper that has 'legend toggle' functionality built in is [c3.js](http://c3js.org/samples/chart_bar.html)

I agree that this is an important tool to have, that many other charting libraries have (thinking of HighCharts, Rickshaw, ...)

Post reply on HN