D3.js: Unterschied zwischen den Versionen
Aus Wikizone
| (7 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
| Zeile 1: | Zeile 1: | ||
Datenvisualisierung interaktiv, Karten, Charts etc. | Datenvisualisierung interaktiv, Karten, Charts etc. | ||
== Links == | == Links == | ||
| + | https://www.youtube.com/watch?v=s3IwphVQ5nI&list=PLb0zKSynM2PBWuEhc1lhAzG0MPz8-rlKj&index=32 // sehr gute Vorlesung von Weitz / HAW Hamburg | ||
https://d3-wiki.readthedocs.io | https://d3-wiki.readthedocs.io | ||
https://leanpub.com/D3-Tips-and-Tricks/read | https://leanpub.com/D3-Tips-and-Tricks/read | ||
http://techslides.com/over-1000-d3-js-examples-and-demos | http://techslides.com/over-1000-d3-js-examples-and-demos | ||
https://christopheviau.com/d3list/gallery.html | https://christopheviau.com/d3list/gallery.html | ||
| + | https://github.com/d3/d3/blob/master/API.md#paths-d3-path API | ||
| + | https://www.dashingd3js.com/svg-paths-and-d3js Gute Einführungen mit SVG Grundlagen allerdings z.T. veraltet | ||
| + | https://www.dashingd3js.com/ | ||
| + | https://www.analyticsvidhya.com/blog/2017/08/visualizations-with-d3-js/ // Gute Erklärungen zu verschiedenen Typen auch Forced Graph Net... | ||
== Basics == | == Basics == | ||
| + | [[D3.js - Tipps und Tricks]] | ||
| + | === Daten === | ||
| + | [[D3.js - Data Handling Basics]] | ||
| + | |||
=== Pie Charts & Doughnuts === | === Pie Charts & Doughnuts === | ||
https://bl.ocks.org/markarios/6b8b91e0c4ce77b4942659aace8d2d6c | https://bl.ocks.org/markarios/6b8b91e0c4ce77b4942659aace8d2d6c | ||
| Zeile 33: | Zeile 42: | ||
=== classed vs. attr("class","foo") === | === classed vs. attr("class","foo") === | ||
https://benclinkinbeard.com/d3tips/attrclass-vs-classed/ | https://benclinkinbeard.com/d3tips/attrclass-vs-classed/ | ||
| + | |||
| + | == Force-directed Layouts == | ||
| + | [[d3js - force-directed layouts]] | ||
Aktuelle Version vom 15. Juli 2020, 16:06 Uhr
Datenvisualisierung interaktiv, Karten, Charts etc.
Links[Bearbeiten]
https://www.youtube.com/watch?v=s3IwphVQ5nI&list=PLb0zKSynM2PBWuEhc1lhAzG0MPz8-rlKj&index=32 // sehr gute Vorlesung von Weitz / HAW Hamburg https://d3-wiki.readthedocs.io https://leanpub.com/D3-Tips-and-Tricks/read http://techslides.com/over-1000-d3-js-examples-and-demos https://christopheviau.com/d3list/gallery.html https://github.com/d3/d3/blob/master/API.md#paths-d3-path API https://www.dashingd3js.com/svg-paths-and-d3js Gute Einführungen mit SVG Grundlagen allerdings z.T. veraltet https://www.dashingd3js.com/ https://www.analyticsvidhya.com/blog/2017/08/visualizations-with-d3-js/ // Gute Erklärungen zu verschiedenen Typen auch Forced Graph Net...
Basics[Bearbeiten]
D3.js - Tipps und Tricks
Daten[Bearbeiten]
D3.js - Data Handling Basics
Pie Charts & Doughnuts[Bearbeiten]
https://bl.ocks.org/markarios/6b8b91e0c4ce77b4942659aace8d2d6c
Hierarchische Daten[Bearbeiten]
Hierarchische Daten sind Daten die sich als Baumstruktur darstellen lassen. Für die Darstellung bieten sich Sunburst, Icicle, Treemaps, Tidy Tree, Radial Tidy Tree, Force Directed Tree... an
https://d3-wiki.readthedocs.io/zh_CN/master/Partition-Layout/ https://observablehq.com/collection/@d3/d3-hierarchy
Sunburst[Bearbeiten]
https://bl.ocks.org/denjn5/e1cdbbe586ac31747b4a304f8f86efa5 - Sunburst Tutorial https://codepen.io/kholja/pen/xxKgZVb Sunburst mit Tooltips (JSON Data) https://bl.ocks.org/maybelinot/5552606564ef37b5de7e47ed2b7dc099 - zoomable sunburst v4 http://bl.ocks.org/hdngr/bb548a2b55e8a53f06ec - color zoomable sunburst
Tutorials[Bearbeiten]
Interaktive Karten mit d3.js https://www.tutorialsteacher.com/d3js/
Partition Sunburst[Bearbeiten]
https://d3-wiki.readthedocs.io/zh_CN/master/Partition-Layout/ - allgemeine Infos / Einstieg https://bl.ocks.org/maybelinot/5552606564ef37b5de7e47ed2b7dc099 - v4 https://bl.ocks.org/denjn5/e1cdbbe586ac31747b4a304f8f86efa5 - Davies Sunburst Tutorial v4 https://www.thegreatcodeadventure.com/d3-sunburst-diagram-tutorial/ https://bl.ocks.org/maybelinot/5552606564ef37b5de7e47ed2b7dc099 Zoomable Sunburst v4
classed vs. attr("class","foo")[Bearbeiten]
https://benclinkinbeard.com/d3tips/attrclass-vs-classed/
