Datenvisualisierung mit D3.js - Einfach und Unkompliziert
5.0 (3 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
29 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Datenvisualisierung mit D3.js - Einfach und Unkompliziert to your Wishlist.

Add to Wishlist

Datenvisualisierung mit D3.js - Einfach und Unkompliziert

Lerne die Kunst der modernen Datenvisualisierung mit D3.js. Sowohl für Neu-Einsteiger, als auch für Erfahrene geeignet!
5.0 (3 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
29 students enrolled
Created by Heiner Ludwig
Last updated 8/2017
German
Curiosity Sale
Current price: $10 Original price: $50 Discount: 80% off
30-Day Money-Back Guarantee
Includes:
  • 2.5 hours on-demand video
  • 1 Article
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Die Grundlagen und Verknüpfung von Vektorgrafik und D3.
  • Diagramme, Zeit-Achsen und eigene Visualisierungen umzusetzen.
  • Daten zu aktualisieren, animieren und manipulieren.
  • Eigene Visualisierungen mit Hilfe von D3 zu erstellen.
View Curriculum
Requirements
  • Du solltest die Grundlagen von JavaScript, CSS und HTML beherrschen.
Description

In diesem Kurs dreht sich alles um die vielgenutzte D3-JavaScript-Bibliothek. D3 zählt zu den populärsten und vielseitigsten Frameworks zur Datenvisualisierung im Web  und sollte zum Portfolio eines jeden Web-Entwicklers gehören

In mehreren Lektionen werden dir die Grundlagen und Funktionsweisen von SVG und D3.js gezeigt und erläutert. Anhand von einfachen Praxis-Beispielen und visualisierten Erklärungen erlernst du, wie Diagramme automatisch aus Datensätzen erstellt werden und mit welchen Funktionsweisen und Konzepten D3 arbeitet.

Nach Abschluss des Kurses wirst du im Stande sein, beliebige eigene Grafiken und Diagramme zu erstellen und diese interaktiv zu gestalten.

Durch Quiz-Fragen wird dein Wissen nach jeder Lektion getestet. Im Anhang stehen Code-Beispiele zu den jeweiligen Themen für dich zum Herunterladen bereit.

Who is the target audience?
  • An alle, die Daten im Web interaktiv und erlebbar machen wollen.
  • An alle, die alle wichtigen Funktionen von D3 schnell verstehen wollen.
  • An alle, die das Enter-Update-Exit-Muster wirklich verstehen wollen.
Students Who Viewed This Course Also Viewed
Curriculum For This Course
40 Lectures
02:30:18
+
Einleitung
15 Lectures 29:03

Entwicklungsumgebung
01:53



SVG - Element: svg
01:41

SVG - Element: rect
00:57

SVG - Element: circle
01:15

SVG - Element: ellipse
01:00

SVG - Element: line
01:08

SVG - Element: polyline
01:28

SVG - Element: path
02:25

SVG - Element: g
01:18

SVG - Element: text
01:25

SVG - Transformationen: Einführung
02:49

SVG - Transformationen: Beispiel
04:01

SVG - Grundlagen
5 questions
+
Grundfunktionalität
4 Lectures 16:36



Autom. Elementerzeugung - JSON
03:17

D3.js Grundlagen
4 questions
+
Diagramme und Skalierungen
9 Lectures 47:07
Lineare Skalierung / scaleLinear()
02:16

Balkendiagramm
07:53

Zeitliche Skalierung / scaleTime()
01:40

Zeitstrahl
05:46

Zeitstrahl - Tooltips hinzufügen
04:48

Ordinale Skalierung / scaleOrdinal()
02:05

Bewertungs-Skala
07:52

Kreis / Ring-Diagramm
07:23

Linien-Diagramm
07:24

Diagramme & Skalierungen
5 questions
+
Enter, Update, Exit & Animationen
4 Lectures 23:42
Enter Update Exit - Erklärung
04:22

Enter Update Exit - Beispiel
03:59

Animationen / transition()
06:22

Balkendiagramm mit Daten-Update und Animationen
08:59

Enter Update Exit & Animationen
4 questions
+
Zoom & Drag
2 Lectures 15:25
Zoom im Liniendiagramm / d3.zoom()
07:26

Drag and Drop / d3.drag()
07:59

Zoom & Drag
3 questions
+
Weitere hilfreiche Funktionen von D3
5 Lectures 18:13
Auf einzelne Element-Daten zugreifen / data()
03:45

Daten filtern / filter()
03:47

Funktionen nach Element-Erzeugung ausführen / each()
03:27

HTML-Node aus D3-Objekt erhalten / node()
03:55

Elemente vor anderen Elementen einfügen / insert()
03:19
+
Anhang - Code-Beispiele
1 Lecture 00:11

Im angefügten Material befinden sich die umfangreicheren Code-Dateien dieses Kurses. Das D3.js-Framework ist nicht enthalten und muss seperat in jeden Ordner hinzugefügt werden, um die Beispiele ausführen zu können! Ggf. muss in der index.html der Pfad zum D3.js-Framework angepasst werden. Alle Beispiele und Diagramme sind für beliebige Projekte nutzbar.

Code-Beispiele zum Herunterladen
00:11
About the Instructor
Heiner Ludwig
5.0 Average rating
3 Reviews
29 Students
1 Course
Software-Entwickler

Nachdem Heiner Ludwig während der Schulzeit seine Vorliebe für Programmierung und digitale Gestaltung entdeckte, startete er im Herbst 2012 sein Studium zum Informatiker an der Technischen Universität Dresden. 

Während der Bachelor-Arbeit entwickelte er mit Hilfe vom Framework D3.js umfangreiche Datenvisualisierungstools, die in Zusammenarbeit mit einer Software-Firma zum Einsatz kommen. 

Nach dem Erhalt des Bachelor of Science, befindet sich Heiner nun im Endspurt des Studiengangs Master Informatik. Nebenbei gibt er Informatik-Nachhilfe für Studenten anderer Studiengänge.