Monday, July 20, 2015

Using Leaflet to Create a Campus Map


The University of Leicester has opted to use Leaflet.js to create its new campus map. One of the great advantages of using the Leaflet mapping platform is the abundance of great quality third party plug-in libraries available. Leicester University has used a number of these libraries to create a great mapped guide to the campus, its buildings and facilities.

The University of Leicester Campus Map uses the OSM buildings plug-in to provide 3d building footprints (pan the map around and notice how the building shadows move). The map also uses the Leaflet.label plug-in to provide labels for these campus buildings. Mouse-over a building on the map and a label appears indicating the building's name.

The map includes a menu which lists the university buildings by campus. This is my one criticism of the map. In my opinion the map would also really benefit from a search option to be able to search for a building by name. This could easily be added to the map using the leaflet-search plugin. Leaflet-search is a powerful customized search engine which you can add to a Leaflet map to allow users to easily search a map by a custom property.

It wouldn't be hard to use the leaflet.search plug-in to provide an option to search the map by the names of university buildings, departments or other facilities.

No comments: