Web-basierte Anwendung 1

Medieninformatik am Campus Gummersbach

Fun with D3.js - Data-Driven Documents

Dauer
240 min
Typ
Workshop
Maximale Teilnehmerzahl
30 Teilnehmer
Verantwortlich
Tim Missal, Jessica Herrmann
Empfohlene Trainings und Workshops als Vorraussetzung
Javascript Basics, Tooling, HTML Advanced, HTML Basics, Javascript Advanced

Termine:

Über den Workshop

An wen richtet sich der Workshop?

Studenten, welche bereits sicher in den Grundlagen von HTML, CSS und JavaScript sind. Die Teilnehmer sollten Interesse an der Visualisierung mit Webstandards haben oder allgemein an der Nutzung einer JavaScript Bibliothek und der Dokumentation dieser.

Worum geht es?

In dem Workshops wollen wir Daten mithilfe gängiger Webstandards zum Leben erwecken. Dafür werden wir die JavaScript Bibliothek D3.js nutzen, als auch die Auszeichnungssprache SVG kennenlernen, mit der wir zweidimensionale Vektorgrafiken definieren können. Das Ziel des Workshops ist, dass jeder Teilnehmer selbstständig in der Lage ist, mit D3.js einfache Diagramme zu erstellen. Ebenfalls soll der Workshop über Quellen informieren, die Wissen zu der Thematik über die Workshop-Inhalte hinaus vermitteln.

Was muss ich mitbringen?

Eigenen Laptop mit einem Editor, FTP-Client und aktuellen Webbrowser.

Was kann D3.js?

Galerie mit Beispielen die mit D3.js erstellt wurden: https://bl.ocks.org/mbostock

Material

Material zum Workshop am 23.11.2017

Praxisprojekte

Projekt 1

Vorgegebene Grafik in SVG nachbauen mit einfachen geometrischen Formen.

Projekt 2

Umsetzen einer Visualisierung mit allen Teilnehmern.

Projekt 3

Editieren des Codes aus Projekt 2, sodass der Code mit JSON Daten arbeitet.

Projekt 4

Selbstständiges erstellen der Teilnehmer einer mit 3 Dimensionen.

Projekt 5

Selbstständiges erstellen der Teilnehmer eines Kreisdiagramms.