mapping-football-stadiums

An interactive map that displays football stadiums in the U.K and allows filtering and searching on select criteria. The map was built using Leaflet.js and stores data about the stadiums in a database. View it here: https://www.sidshekhar.com/mapping-football-stadiums/

Map View showing stadium detail and filters on the right

Libraries Used

• Leaflet.js - http://leafletjs.com/
• jQuery - https://jquery.com/
• jQueryUI - https://jqueryui.com/
• Intro.js - http://introjs.com/
• Chart.js - http://www.chartjs.org/
• EasyButton.js - http://danielmontague.com/projects/easyButton.js/

Aim

The The purpose of this map is to give the viewer a high level visualization of football stadiums across the U.K. The aim is to provide a deeper perspective into the breadth of sporting facilities available in the country - allowing the user to filter by team and capacity.

Interesting patterns can be observed in the clustering of stadiums near major metropolitan areas in England

---

The juxtaposition of NASA's 'Earth at Night' view below the markers shows the clustering patterns and their correlation to stadium capacity even more clearly.

Usage

Originally this project was put up on University College London's intranet with the marker and league data hosted on a PostgreSQL database. All of the raw data can be found in this file - which was sourced from Chris Bell's work found here. I converted the CSV data into JSON in order to host a static version of the website on github - and changed up some of the filtering functions in order to only use client-side CSS/JS/HTML instead of relying on PHP and SQL queries.