| Name | SCIPER | Github |
|---|---|---|
| Lola Maïa Lou Bardel | 299886 | Lola-Bardel |
| Stefanie Helfenstein | 327500 | shelfens |
| Casimir Maximilian Nüsperling | 330680 | cmaximilian |
| Nicolas Filimonov | 313213 | Rayjine |
With MigrationViz, we aim to build a site which invites people to explore human migration data. Available for curious internet travelers, friends or ourselves, we hope the website could help unveil the order of magnitude of global migration and refugees' reality, without losing sight that behind every number stands a person.
- D3.js (Lecture 4 and 5) coupled with a very useful resource found on the web "D3.js tips and tricks" from Malcolm Maclean
- Application of recommendations found in lectures "Do and don't in data viz" (lecture 7) and storytelling (lecture 12) Specific plugin made available through the flexibility of D3.js allows us to produce Sankey diagram as well as maps.
As seen in the figure below, we chose to organize our website in a slide-like structure. For the first part of the project, we focused on the technical implementation of the visualization, which explains the actual simplicity of the website design. We will improve it over the course of the semester, by finding a color scheme and a font that reflects well the subject we are addressing.
Explanation: As an introduction to our website, we start by representing the flow of migration between continents via a Sankey diagram. The idea behind it is to provide basic numbers: for example, more than half of the migration in Asia, Europe and Africa stays in its continent of origin. When hovering on the links as well as the continents, numbers are displayed to allow digging for more information.
We will improve the visualization by adding a timeline allowing users to choose to display data from 1990 to 2020 by 5-years slices, to explore evolution over time. Depending on easiness of implementation and clarity we may put color only on the continent names and not on the links, unlike what is depicted here.
The work in the following weeks will consist of realizing the tasks below:
- data organization in JSON objects of data from 1990, 1995, ... to 2020
- implementation of an interactive cursor to choose the data period used
- addition of origin and destination above the column that are at the moment unnamed
Extra ideas: If time allows, we could let the public choose if the data is to be displayed by continent (as it is actually done) or more fine-tuned by sub-continent (western Asia, southern Africa…), but questions around readability are raised. Visualization of evolution over time could also be interesting to characterize, but we do not already have a clear idea in mind.
Explanation: The screenshot above shows the total number of refugees per country in 2020. It is just the first functional proof of concept implementation, so still a bit buggy.
To achieve a complete visualization, the following steps are required:
- Add legends to the map
- Improve the tooltip to remove majority of bugs and add additional relevant information
Extra ideas:
- Explore other data as well using the same visualization implementation
- switch map implementation from GeoJSON to TopoJSON for better charging time and more accurate maps
- Display data in time
Explanation: Focusing on the Mediterranean region, we visualize the deaths of the people trying to reach Europe. We display the information of their death as points of varying diameters, related with the reported number of people that died for each tragedy. When hovering, complementary information that the database may furnish are displayed. This visualization aims to highlight the individuality of the tragedies that stroke. We try to emphasize the fact that on our map, points stand for people and not only for data.
Furthermore, in order to be able to explore the data further, you can choose the time period you want to have displayed on an interactive timeline. The cursor is adjustable. On the y axis the total number of deaths per month is displayed as a line over time.
Another element of the map is the number of people displayed in comparison with the number of people in total represented through the dataset. This is illustrated in the form of text and corresponding circle sizes on the top right of the map.
Extra ideas: In order to be able to better understand the map, we will need to add a legend explaining the size of the circles and their significance. Another idea was to display the complementary information about the events in an explanation box on the right of the map. As we advance, the style of the map will be defined along the website design.