Mashups: Final Project
For my final project, I want to make a web page about cherry blossom related data in Japan. I would like to use different tools I learnt in this semester to do data visualization in order to compare their strengths and weaknesses.
DATA & API
The data I used in this web page are:
Cherry blossom blooming forecast (date of first bloom) - 2018 Season
Google Trends API: The value of the word "Sakura" being searched in Japan.
MongoDB API: How many times the "LOVE" button on my webpage being clicked.
1. Cherry blossom blooming forecast (date of first bloom) - 2018 Season
I tried to find an API for cherry blossom data, but it was no such public API. So I used the data shown on the web page of Japan National Tourism Organization to make a CSV file. Then I joined GeoJSON file about Japan map against the CSV file to make a JSON file which contains the geolocation data as well as the cherry blossom data. I used geojson-join.
Data from Japan National Tourism Organization
The CSV file of cherry blossom data
Part of the JSON file. See the whole JSON file here.
2. Google Trends API
The data returned from the API looks like this.
3. MongoDB API
In order to record how many times the "LOVE" button on my webpage being clicked, I used M-Lab’s database server. I created a database and a collection in MongoDB. And I used MongoDB API to access my database, upload data and view all the data that have been sent to that database.
To push and load the data, I used P5.js HttpPost() function and loadJSON() function.
The data I got from MongoDB API looks like this:
DATA VISUALIZATION
The coding language I used to visualize data are:
D3.JS
P5.JS
Mapboxgl.js
D3.JS
P5.JS
Mapbox gl.js
