5 ms·

Awesome D3

150 points by chrtze 11y ago

tudorw 11y ago
Here's another great resource, maybe you could pair up? https://github.com/mbostock/d3/wiki/Gallery https://github.com/mbostock/d3/wiki/Gallery
- chrtze 11y ago
  We wanted to focus more on tools and plugins, not on visualization examples because many resources for that already exist.
  - tudorw 11y ago
    Good enough reason, I'll certainly be using your resource, thanks :)
sebg 11y ago
2490 D3 Examples => http://christopheviau.com/d3list/gallery.html http://christopheviau.com/d3list/gallery.html (sortable, filterable, searchable)
- mdaniel 11y ago
  Damn, I was hoping they were all hosted on that site; I hope the Wayback machine has grabbed them all or it's going to link-rot. I'll submit that URL and hope that Wayback chases outbound links. Update: thankfully, it was already in the Wayback; unfortunately, the page is driven by a docs.google.com spreadsheet, which Wayback did not tolerate, yielding a JS error and on a page that is likely entirely JS, that's fatal. https://web.archive.org/web/20150321071838/http://christopheviau.com/d3list/gallery.html https://web.archive.org/web/20150321071838/http://christophe...
  - timboslice 11y ago
    Here is a static list that is archived already :) http://christopheviau.com/d3list/index.html http://christopheviau.com/d3list/index.html https://web.archive.org/web/20150511022323/http://christopheviau.com/d3list/index.html https://web.archive.org/web/20150511022323/http://christophe...
arthurcolle 11y ago
Is this inspired by the Elixir collection of links found here: https://github.com/h4cc/awesome-elixir https://github.com/h4cc/awesome-elixir
- vmind 11y ago
  "awesome" lists are rather common, there's even a meta-awesome list of them: https://github.com/sindresorhus/awesome https://github.com/sindresorhus/awesome
  - yaph 11y ago
    And even a List of Lists of Github Lists https://github.com/yaph/lologl https://github.com/yaph/lologl (shameless plug)
  - kodablah 11y ago
    There is also the meta list at https://github.com/bayandin/awesome-awesomeness https://github.com/bayandin/awesome-awesomeness which is popular as well.
david_p 11y ago
Rickshaw (live time-series charts) does not get enough credit! http://code.shutterstock.com/rickshaw/examples/extensions.html http://code.shutterstock.com/rickshaw/examples/extensions.ht...
pessimism 11y ago
If anyone has a good library or a pro tip for making responsive charts, I’d love to know; I am somehow still having trouble implementing it: * http://bl.ocks.org/ndarville/11094667 http://bl.ocks.org/ndarville/11094667 * https://github.com/ndarville/d3-charts/issues/11 https://github.com/ndarville/d3-charts/issues/11
- me_bx 11y ago
  This tutorial is not bad at all: Building Responsive Visualizations with D3.js [1] [1]: https://blog.safaribooksonline.com/2014/02/17/building-responsible-visualizations-d3-js/ https://blog.safaribooksonline.com/2014/02/17/building-respo...
- yaph 11y ago
  For the basic chart types, I think dimple is a good choice. Here is an example for creating a responsive bar chart http://dimplejs.org/advanced_examples_viewer.html?id=advanced_responsive_sizing http://dimplejs.org/advanced_examples_viewer.html?id=advance... By default, as fas as my experience goes, charts will fit the containing element, if width and height of the chart are not set explicitly.
felixbraun 11y ago
Klack and Möller (the curators of this) just recently did great visualization with D3 for Morgenpost in Berlin: "Mapping population dynamics in Europe" http://interaktiv.morgenpost.de/europakarte/#7/48.738/10.569/en http://interaktiv.morgenpost.de/europakarte/#7/48.738/10.569...
- chrtze 11y ago
  Thanks, Felix ;)
erex78 11y ago
You might consider adding Mapsense[https://github.com/mapsense/mapsense.js https://github.com/mapsense/mapsense.js], a library for using tiled vector sources with D3. (I work at mapsense).
gnarmis 11y ago
D3 is excellent. I poked around with Chernoff faces using D3 and React and had a great time[1]. I love these awesome lists, great for compressing the accumulated knowledge of open source tools. 1: https://github.com/gnarmis/chernoff-faces https://github.com/gnarmis/chernoff-faces

150 points by chrtze 11y ago

Here's another great resource, maybe you could pair up? https://github.com/mbostock/d3/wiki/Gallery https://github.com/mbostock/d3/wiki/Gallery

chrtze 11y ago
We wanted to focus more on tools and plugins, not on visualization examples because many resources for that already exist.
- tudorw 11y ago
  Good enough reason, I'll certainly be using your resource, thanks :)

sebg 11y ago

2490 D3 Examples => http://christopheviau.com/d3list/gallery.html http://christopheviau.com/d3list/gallery.html (sortable, filterable, searchable)

mdaniel 11y ago
Damn, I was hoping they were all hosted on that site; I hope the Wayback machine has grabbed them all or it's going to link-rot. I'll submit that URL and hope that Wayback chases outbound links. Update: thankfully, it was already in the Wayback; unfortunately, the page is driven by a docs.google.com spreadsheet, which Wayback did not tolerate, yielding a JS error and on a page that is likely entirely JS, that's fatal. https://web.archive.org/web/20150321071838/http://christopheviau.com/d3list/gallery.html https://web.archive.org/web/20150321071838/http://christophe...
- timboslice 11y ago
  Here is a static list that is archived already :) http://christopheviau.com/d3list/index.html http://christopheviau.com/d3list/index.html https://web.archive.org/web/20150511022323/http://christopheviau.com/d3list/index.html https://web.archive.org/web/20150511022323/http://christophe...

arthurcolle 11y ago

Is this inspired by the Elixir collection of links found here: https://github.com/h4cc/awesome-elixir https://github.com/h4cc/awesome-elixir

vmind 11y ago
"awesome" lists are rather common, there's even a meta-awesome list of them: https://github.com/sindresorhus/awesome https://github.com/sindresorhus/awesome
- yaph 11y ago
  And even a List of Lists of Github Lists https://github.com/yaph/lologl https://github.com/yaph/lologl (shameless plug)
- kodablah 11y ago
  There is also the meta list at https://github.com/bayandin/awesome-awesomeness https://github.com/bayandin/awesome-awesomeness which is popular as well.

david_p 11y ago

Rickshaw (live time-series charts) does not get enough credit! http://code.shutterstock.com/rickshaw/examples/extensions.html http://code.shutterstock.com/rickshaw/examples/extensions.ht...

pessimism 11y ago

If anyone has a good library or a pro tip for making responsive charts, I’d love to know; I am somehow still having trouble implementing it: * http://bl.ocks.org/ndarville/11094667 http://bl.ocks.org/ndarville/11094667 * https://github.com/ndarville/d3-charts/issues/11 https://github.com/ndarville/d3-charts/issues/11

me_bx 11y ago
This tutorial is not bad at all: Building Responsive Visualizations with D3.js [1] [1]: https://blog.safaribooksonline.com/2014/02/17/building-responsible-visualizations-d3-js/ https://blog.safaribooksonline.com/2014/02/17/building-respo...
yaph 11y ago
For the basic chart types, I think dimple is a good choice. Here is an example for creating a responsive bar chart http://dimplejs.org/advanced_examples_viewer.html?id=advanced_responsive_sizing http://dimplejs.org/advanced_examples_viewer.html?id=advance... By default, as fas as my experience goes, charts will fit the containing element, if width and height of the chart are not set explicitly.

felixbraun 11y ago

Klack and Möller (the curators of this) just recently did great visualization with D3 for Morgenpost in Berlin: "Mapping population dynamics in Europe" http://interaktiv.morgenpost.de/europakarte/#7/48.738/10.569/en http://interaktiv.morgenpost.de/europakarte/#7/48.738/10.569...

chrtze 11y ago
Thanks, Felix ;)

erex78 11y ago

You might consider adding Mapsense[https://github.com/mapsense/mapsense.js https://github.com/mapsense/mapsense.js], a library for using tiled vector sources with D3. (I work at mapsense).

gnarmis 11y ago

D3 is excellent. I poked around with Chernoff faces using D3 and React and had a great time[1]. I love these awesome lists, great for compressing the accumulated knowledge of open source tools. 1: https://github.com/gnarmis/chernoff-faces https://github.com/gnarmis/chernoff-faces