BigData mit JavaScript visualisieren: D3.js für die Darstellung großer Datenmengen einsetzen

Willkommen im Datenzeitalter. Ob Smartphone, DSL-Router oder auch beim Einkauf um die Ecke: Daten fallen überall in großer Menge an und werden gespeichert. Um diese großen Datenmengen effizient und nutzbringend einsetzen zu können, ist eine geeignete Darstellungsform notwendig. Mit D3.js steht eine JavaScript-Bibliothek bereit, um große Datenmengen in unterschiedlichsten Diagrammtypen darstellen zu können. Werden Sie damit Herr der Daten. Erste Diagramme mit D3.js Bevor Sie eigene Diagramme mit D3.js erstellen können, müssen Sie sich mit der entsprechenden Syntax auseinandersetzen. Gull erklärt Ihnen die wichtigsten Regeln im ersten Kapitel. Danach geht es direkt ans Eingemachte: Balkendiagramme, Kreisdiagramme und animierte Diagramme. Erleben Sie die großen Möglichkeiten von D3 anhand von eigenen Diagrammen. Komplette D3-Anwendung umsetzen Nach einem theoretischen und praktischen Einstieg in den ersten beiden Kapiteln widmet sich das Kapitel 3 einer großen Anwendung, dem Métro Information Tracker. Hierbei nutzen Sie öffentlich zugängliche Daten (Open Data), um mit unterschiedlichen Diagrammen Informationen zur Métro in Paris darzustellen. Hierbei setzen Sie sich mit allen Themen auseinander, die die moderne Webentwicklung zu bieten hat: HTML, CSS, JSON und SVG. In einem Force-Directed-Graph stellen Sie die Daten dar und reichern diesen mit SVG-Grafiken an. Nachdem Sie dieses Projekt selbst umgesetzt haben, sind Sie gewappnet für eigene große D3-Anwendungen. Der Quellcode steht auch online zur Verfügung. Die Königsdisziplin: Animation So lernen Ihre Modelle das Laufen! Erfahren Sie, wie Sie eine Armatur eine Art Skelett für Ihre Charaktere erstellen und sie mit der 3-D-Grafik verknüpfen. Anschließend können Sie die Animationsphasen selbst erstellen und aufnehmen. Darüber hinaus sehen Sie, wie Sie Licht und Schatten für die Kameraaufnahme gekonnt einsetzen. Aus dem Inhalt: Datendarstellung im Web mit D3 Eigenheiten und Syntaxregeln Plug-ins von D3.js Document Object Model Visualisierung von Daten Erstellen eines Balkendiagramms Erstellen eines Kreisdiagramms Animierte Diagramme Open Data Daten als Force-Directed-Graph darstellen Stylesheet für Formatierung einsetzen Force-Directed-Graph als Baum darstellen JSON-Daten einlesen und verarbeiten Knoten im Diagramm suchen Grafiken für die Knoten verwenden Scalable Vector Graphics einsetzen