GTA Coffee Shops - Interactive Web Mapping Application

An interactive web mapping application built with Leaflet.js and OpenStreetMap that visualizes coffee shop locations across the Greater Toronto Area (GTA). The application features a dual-panel interface with a clickable sidebar listing and an interactive map displaying 5 coffee shop locations (Tim Hortons, Starbucks, Second Cup) across Toronto, Mississauga, Brampton, Markham, and Vaughan. The map also integrates a secondary open data layer showing parks (High Park, Trinity Bellwoods) as green markers, demonstrating multi-layer GIS data visualization. Users can click on sidebar listings or map markers to fly to specific locations with smooth animations and view detailed popups with store information. This project demonstrates proficiency in web-based GIS development, spatial data visualization using GeoJSON format, and interactive map design principles applicable to urban planning analysis.

Designed and developed the complete interactive web mapping application from scratch. Implemented the Leaflet.js mapping library with OpenStreetMap tile layers, created GeoJSON feature collections for store location data, built the interactive sidebar with click-to-fly functionality, and added multi-layer data visualization with parks as a secondary dataset. Developed responsive design for both desktop and mobile viewing.

Successfully created a fully functional interactive web mapping application that demonstrates GIS web development skills applicable to urban planning. The application showcases spatial data visualization, user interaction design, and multi-layer mapping techniques. The project can be adapted for various planning applications including service area analysis, commercial district mapping, and community resource visualization.