Młodzi XXL a interaktywna grafika z R i biblioteką D3 javascript

We wtorek Magda Małczyńska-Umeda, pokazała swoją wersję infografiki o nadwadze w różnych grupach wiekowych w Polsce.
Czego ja się nauczyłem z tego wpisu? Czasami mniejsza rozdzielczość danych (dane pokazane są z dokładnością do 5%) idzie w parze z większą czytelnością. Dwadzieścia okazuje się wystarczającą liczbą ludzików by pokazać rosnący problem nadwagi z wiekiem. Mniej nie pokazałoby różnic, więcej byłoby nieczytelne. W tym przypadku dwadzieścia to jest TA liczba.
Dzisiaj wykorzystam wizualizację Magdy by pokazać jeszcze dwa wymiary z danych: kraj i rok w którym przeprowadzono badanie.
Acha, i wykorzystam do tego bibliotekę D3 do tworzenia interaktywnych wykresów.

Poniżej interaktywna grafika przedstawiająca jak w danym kraju, w danej grupie wiekowej i określonym roku wygląda rozkład osób z niedowagą, prawidłową wagą, nadwagą i otyłością. Warto wyklikać jak problemy z wagą wyglądają w różnych krajach dla naszej grupy wiekowej. Im mniej niebieskich i czerwonych ludzików tym lepiej. Ja byłem zaskoczony odkryciem w którym kraju (z prezentowanych) problemy z nadwagą są największe.

Jeżeli poniżej nie wyświetla się żaden obrazek to znaczy, że przeglądarka nie obsługuje HTML5 i aby zobaczyć grafikę trzeba otworzyć ten link.

Jak powstała ta wizualizacja? Mamy ikony opracowane przez Magdę, wykorzystujemy R do pobrania danych z Eurostatu i policzenia rozkładów nadwagi w różnych kombinacjach tych trzech zmiennych, następnie wykorzystujemy bibliotekę javascript D3 by animować wykres w zależności od wyborów użytkownika.

D3 okazała się prosta i intuicyjna do opanowania. Mnie wystarczył opis statycznych możliwości D3 z tej strony, plus opis funkcji .transition() i .delay() [możliwości tego języka jeżą włosy, dla mnie to doświadczenie porównywalne było z efektywnością wyniki/kod w OpenGL].

Kod javascript jest włączony w źródło strony. Wystarczy więc wyświetlić źródło tej strony by zobaczyć jak działa powyższa infografika. Kiedyś może ją opiszę dokładniej na blogu.

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *