Programmiertes Entwerfen 2
World Happiness
Ich habe mich für meine Datenvisualisierung für den Datensatz “World Happiness Report” entschieden. Die Länder haben dabei einen Happiness Score, anhand dessen sie jedes Jahr in eine Rangliste eingeordnet werden können. Auch Parameter wie die Verbreitung von Korruption, der soziale Support oder die Freiheit, Lebensentscheidungen zu treffen, spielen dabei eine wichtige Rolle. Wo sind die Menschen nun am glücklichsten und wo am unglücklichsten? Und kann sich das über die Jahre auch stark verändern?
Diese Fragen habe ich mir gestellt, mit dem Ziel sie durch meine Datenvisualisierung beantworten zu können:
- In welchen Ländern haben die Menschen wenig Freiraum, um Lebensentscheidungen zu treffen?
- Welche Länder sind auf der Life Ladder weit oben, welche weit unten?
- Wie verändert sich der Score über die Jahre?
- Gibt es Ausreißer?
Nachdem ich einige Skizzen angefertigt habe und auch in Figma mehrere Farbvarianten erstellt hatte, ging es an das Programmieren in VS Code. Dabei nutzte ich die Libraries gmynd.js und jquery.min.js um meine Datenvisualisierung umzusetzen.
Weltkarte
Der erste Screen ist die Weltkarte. Dort sieht man die nach dem Happiness Score eingefärbten Länder. Die gewählte Farbskala geht von gelb über orange zu immer dunkleren Lilatönen. Das Gelb steht dabei für die besten Happiness Scores, Lila für die schlechtesten. Wenn man auf die Jahresbuttons unten am Bildschirm klickt, wird die Differenz-Ansicht angezeigt. Hier kann man in Form von Konturen die positive oder negative Entwicklung des Scores zum Jahr 2023 sehen. Umso größer die Kontur, umso größer auch die Veränderung. Durch das Hovern über die Länder erscheint ein Tooltip mit den beiden Scores und der Differenz. Durch erneutes Klicken auf die Jahreszahl kann die Differenzansicht wieder aufgehoben werden.
Detail-Ansicht
Wenn man den Toggle-Button klickt, ist die “Details”-Ansicht aktiv. Hier sind die Länder nach dem Score sortiert, und man sieht weitere Parameter (Social Support, Freedom to make life choices, Positivity, Negativity, Corruption), die Einfluss auf das Ergebnis der einzelnen Länder haben. Die positiven Parameter sind in warmen Orangetönen gehalten und über den Länderpunkten, die negativen Parameter sind in kälteren Blautönen unterhalb der Länderpunkte platziert. Somit ist klar erkennbar welche Länder zum Beispiel mehr negative Punkte haben und welche weniger, vor allem ungewöhnliche Verteilungen der Punkte sind dadurch gut erkennbar und stechen raus. Diese Ansicht kann für die Jahre 2011, 2014, 2017, 2019 und 2023 angezeigt werden. Durch Klicken auf die Parameter in der Legende können auch diese einzeln angesehen werden. Zur besseren Vergleichbarkeit ordnen sie sich immer an einer geraden Linie an, die anderen Parameter werden ausgeblendet. Auch hier kann direkt zwischen den Jahren gewechselt werden, ohne dass wieder alle Parameter angezeigt werden.
