Turun yliopisto

Capstone

The goal for the Big Data Visualization project was to produce good-looking visualization of regional economic data combined with another aspect and create an interactive application displaying the data on a map.

In this project we have used data sets showing the migration between Finnish regions paired with taxation data of the same regions. The idea was to find correlations between the two data sets and visualizing our findings with a web application displaying the map of Finland.

The web application allows the viewer to choose different criteria based on the migration data which are year, age, sex and level of education. From the taxation data you can choose between paid taxes, tax returns, back taxes and number of organizations. Migration data is fetched directly from the StatFIN database by using its open API. The migration data is from a data sheet which can be filtered manually in the application.

The platform we have created can be easily extended to use different data sets and different maps.

Technical Documentation

The application is made using React with TypeScript and SASS. There application does not have a back end, as the aim is to fetch all the needed datasets straight from open APIs.

The map of Finland is created from a GeoJSON file, which determines the coordinates of each region of Finland, by using React-Simple-Maps that uses d3-geo and topojson to create SVG elements for each region.

User Manual

Source code at: Capstone-StatFin BitBucket

How to build the source code: 0. Install npm (comes with NodeJS) Link to NodeJs 1. Clone repository with git git clone https://Hukn@bitbucket.org/Hukn/capstone-statfin.git 1. Install dependencies with npm npm install 2. Start development server
npm run webpack-dev-server --mode=development --open 3. The application will open in browser localhost:8080

How to use: 1. Use the drop-down at the top of the page to select the data type. Migration Data allows selecting filters from the available drop-downs. To apply filters press the button to re-fetch data. 2. The year can be selected from the slider at the bottom of the page. You can also animate year by pressing the button on the right. 3. Hover your mouse over the regions to display numbers and percentages.
Projektin kuva