On 17 March 2018, National Parks Board launched an all-new web site called Trees.sg. On the next day, I started my journey in getting the data and visualizing it to my heart's content.
This is a personal side project to fuel my curiosity on these factors:
- Plotting more than 500,000 data points on Mapbox GL JS.
- Data visualization of all tree data, in 4 criterias:
- Type; Tree, Heritage
- Girth (meters)
- Age (years)
- Family (to group up the large number of species)
- Discovery of trees.
- Prominent/important trees stand out more by having larger radii.
- Super fast info card by just hovering on the tree markers (for devices with a mouse).
๐ ๐ ๐ Read more about it ๐ ๐ ๐
Technicalities
Web App
Node.js is required.
npm install
- install dependencies.npm start
- start a local server for the site.npm run build
- build the assets indist
folder for deployment.
Data
Available here: cheeaun/sgtreesdata.
Icon
Uses 80
).
Copyright & license
- Data from Trees.sg ยฉ National Parks Board
- Map ยฉ Mapbox ยฉ OpenStreetMap contributors
- SVG icons from Font Awesome
- Code licensed under MIT