Todesursachen

Während des Kurses Programmiertes Entwerfen 2 haben wir gelernt, wie man Datensätze mithilfe von JavaScript und jQuery visualisiert. Hierbei wurde auch die Gmynd-Library genutzt. Mit den visuellen Elementen wie Form, Farbe und Sortierung werden große Mengen komplexer Daten verständlich dargestellt, so dass die Inhalte und Zusammenhänge in den Daten leicht verständlich sind.

Datensatz

Der Datensatz, der genutzt wird, beinhaltet detaillierte Daten über die Todesursachen in Deutschland von 1980 bis 2020, inklusive 81 Todesursachen, der Anzahl an Todesfällen, dem Geschlecht und 17 Altersgruppen.
Nach der Überprüfung aller Daten fand ich Überschneidungen vor. Alle Todesursachen waren Krankheiten, einige davon waren Unterkategorien von anderen. Um die Daten weiter zu bereinigen, verwendete ich die Internationale statistische Klassifikation der Krankheiten und verwandter Gesundheitsprobleme 10. Revision von DIMDI(Deutsches Institut für Medizinische Dokumentation und Information) und unterteilte sie schließlich in 17 Kategorien.

Konzept

Nach der Analyse und Bearbeitung der Daten, bestimmte ich den Aufbau der Visualisierung, indem ich mich fragte: Was möchte ich mit der Darstellung der Daten mitteilen? Meine Antwort ist: Die Beziehung zwischen Alter und verschiedenen Krankheiten sowie das Verhältnis zwischen dem Jahr und der Anzahl an Todesfällen aufgrund von Krankheiten.

Da die Anzahl der Sterbefälle in den Daten so stark variiert (von 0 bis 49480), ist es schwierig, die Daten klar darzustellen, wenn sie einfach durch die Größe der Formfläche unterschieden werden, deshalb habe ich große Wertebereiche aufgeteilt und jeder Teil hat unterschiedliche Wertebereiche, um mehr Details zu zeigen. Und außer dem Mindestwertebereich habe ich die Dicke der Ränder verwendet, um die Größe der Daten zu zeigen. Außerdem habe ich Farben verwendet, um die kleine Unterscheidung zwischen den Größen zu verbessern.

Design

Auswahl der Farbe
Ich wollte Farben wählen, die keine starke Bedeutung haben und ein Gefühl der Ruhe vermitteln, also wählte ich Rosa und Blau, die nicht besonders gesättigt waren. Die Helligkeit dieser beiden Farben vor einem dunkelgrauen Hintergrund lenkte von der Aufmerksamkeit ab, wobei das Rosa heller war als das Blau, das eine größere Anzahl von Menschen repräsentierte.

Da ich hier zwei visuelle Parameter zur Darstellung derselben Dimension verwendet habe, habe ich beschlossen, die Anzahl der Todesfälle im gesamten Datensatz anhand der Größe der Formen zu vergleichen, und die Änderung der Farbe stellt einen Kontrast in der Anzahl der Personen in jeder Krankheit dar.

Interaktion
Während der gesamten Datavisualisierung wollte ich, dass der Betrachter durch die Bewegung der Maus erkunden und verstehen kann, was ich sagen wollte. Daher kann der Betrachter in der Hover-Funktion nicht nur die Informationen lesen, indem er sich an die Position des Punktes bewegt, sondern erhält auch die entsprechenden Textinformationen in jeder Zeile und Spalte.
Außerdem habe ich eine Schaltfläche eingerichtet, mit der die Anzeige der Daten für die verschiedenen Geschlechter umgeschaltet werden kann.Und wenn der Nutzer Informationen über die genaue Ursache und Anzahl der Todesfälle wünscht, kann er dies durch Anklicken des entsprechenden Punktes tun.

Endergebnis