Säulen der Grafik

Interaktive Schaubilder mit der JavaScript-Bibliothek D3

Wissen | Know-how

Eine Infografik sagt mehr als tausend Zahlen. Wenn sie dann noch hübsch ist, sich animieren lässt und durch Interaktion mit dem Nutzer Aussehen und Aussage verändern kann, ist das die Kirsche auf dem Sahnehäubchen erfolgreicher Datenpräsentation. D3 machts möglich.

Die Zahlen 34, 180, 200 und 60 haben für sich allein gesehen keine Bedeutung. Die bekommen sie erst, wenn man dazu erfährt, dass es sich um die Jahresernten auf einer virtuellen Farm im Internet handelt, zum Beispiel 34 Kilogramm Äpfel, 180 Kilogramm Birnen, 200 Kilogramm Tomaten und 60 Kilogramm Karotten. Um sich besser vorzustellen zu können, wie sich die Menge der geernteten Äpfel zu den anderen Sorten verhält, muss eine Grafik her. Also alles in Excel eintippen und schnell ist ein Säulendiagramm fertig.

Aber Moment … wäre es nicht schöner, wenn dieses Diagramm alle Bekannten auf einer Webseite sehen und dann beispielsweise zwischen den verschiedenen Erntejahren hin- und herschalten könnten? Doch so etwas in JavaScript zu programmieren, ist nicht einfach. Dieser Herausforderung haben sich vor ein paar Jahren einige Entwickler gestellt, allen voran der durch seine Infografiken in der New York Times bekannt gewordene Michael Bostock. Herausgekommen ist die freie JavaScript-Bibliothek D3.js (Data Driven Documents). ...

Sie möchten wissen, wie es weitergeht?

Säulen der Grafik

2,49 €*

c't 04/2013, Seite 174 (ca. 6 redaktionelle Seiten)
Direkt nach dem Kauf steht Ihnen der Artikel als PDF zum Download zur Verfügung.

Artikel-Vorschau
  1. Datenbasis
  2. Zeichenfläche
  3. Säulen
  4. Stil und Schrift
  5. Übergang
  6. Landkarte
  7. Layouts und der Rest

Lesen Sie hier die Verbraucherinformationen

* Alle Preise verstehen sich inklusive der gesetzlichen MwSt.

Als c't-Plus-Abonnent gratis lesen

weiterführende Links

Videos

Interaktive Infografiken fürs Web mit D3 – Säulen der Grafik

Infos zum Artikel

Kapitel
  1. Datenbasis
  2. Zeichenfläche
  3. Säulen
  4. Stil und Schrift
  5. Übergang
  6. Landkarte
  7. Layouts und der Rest
0Kommentare
Kommentieren
Kommentar verfassen
Anzeige
Videos

Anzeige

weiterführende Links
  1. Zu diesem Artikel hat die Redaktion noch folgendes zusammengestellt:

    Links (26)

Anzeige