York St John University
Interactive campus map for York St John University, using JavaScript and the Google Maps API.
York St John University
Contract position for York St John University where I was tasked with creating an interactive campus map, similar to the one on the University of York’s website but tailored to York St John’s more compact campus. The map was created by myself using HTML, CSS, Javascript, and the Google Maps API.
I created an initial proof of concept using GUI-based tools where you can export data to a KML format — however it quickly became clear that these tools were obsolete, so I decided to go deeper and learned the Google Maps API, which is an incredibly powerful tool.
- Google Maps API
- Javascript
- HTML5 & CSS3
- Graphic Design
How it works
The interactive campus map works as follows: you click on a category; the map resizes to a zoom level where all buildings from that category are visible; you click on an item to read a short description of it; you can get directions from your current location to the selected item; or you can click to read more, which brings up an animated overlay containing a full description.
Results
The interactive campus map launched in time for Clearing, with several staff members saying it was the best in-house application they had ever created.