District Tree

District Tree is an interactive map of street trees in Washington, DC that uses an open dataset curated by DDOT's Urban Forestry Division of the DC city government. This large dataset contains locations and other detailed information for more than 180,000 trees in a form of a CSV file. The original format did not fit the purpose of this app, which required data to be reorganized to match the PostGIS formatting, and cleaned of abundant information. The reorganized data was then used to create a Ruby on Rails API. The frontend is built in React and Leaflet, as well as Mapbox basemap, Semantic UI and CSS for styling. To learn more about the creation of this app, check out blogs linked bellow.

TECHNOLOGIES — Ruby on Rails, PostGIS, React, Leaflet, Mapbox, Semantic UI

CODE — Backend | Frontend

DEMO — Link

BLOG — Building Backend | Building Frontend

map with marker clusters
district tree logo
popup field on a map
filtered map