Here is a selection of web map/tools I have recently created:
About: This map shows the live locations of the bikes in the Yobike bikeshare. The site displays stats indicating popular ride times/days, number of trips per day and number of available bikes by day etc. You can also see a heatmap of bike locations by time of day.
I have added new cities as and when the scheme has expanded – currently covering various cities in England and France.
Technologies used: Leaflet, jQuery, php, SQLite and Material Design Lite
About: This was an Android app and accompanying web map I put together to allow friends and family to live track myself and a few friends running the 2017 Bath Half Marathon. The Android app pushed the users current location to a database while spectators could visit the website and see each persons progress around the route in relation to each other, as well as the race leaders, along with some basic stats.
The app and website worked really well and is still used occasionally when out on a run to share location with partners etc – so you may see some activity on the live link below, or you can see a replay of the race as it happened, albeit at 50x speed!
Technologies used: Leaflet, jQuery, php, turfjs, SQLite and Tasker (for the app)
GP Map Plus
About: This web tool was produced to support GP practices and NHS England and is currently used by over 800 GP practices across the south of England. It allows GPs to better understand the distribution and demographics of their patients as well as identifying patients who are currently registered outside of the practice catchment. The tool pulls live data from various databases, combines with up to date Ordnance Survey data as well as utilising 3rd party routing/accessibility APIs to allow GP practices to make informed decisions.
Technologies used: Leaflet, jQuery, php, turfjs, MS SQL Server Spatial
URL: More Info
About: On the surface this is a simple web tool which allows users to enter a home address or postcode and instantly, but more importantly accurately, identify which GP practices are currently accepting patients. This tool differs from other similar services as the results are based on actual GP catchment areas and the current status of all the practices rather than just identifying the nearest practice on the map via straight line distance (which may not accept the patient). This tool also utilises the iGeolise routing API which allows the user to sort the practices by the quickest route using their chosen mode of transport – which in some cases can be quite different.
Technologies used: Leaflet, jQuery, php, MS SQL Server Spatial
About: Since around 2008 I have been recording my location using a GPS tracker. I take it on most journeys (if I remember to take it, that is) except for every day stuff like commuting, around town etc. I process all the tracks, cleaning up any erroneous points, simplify and then style in TileMill. The data is served via a php MBtile server.
The map is a little out of date so only covers 2008-14 but will be updated when I get the chance.
It’s actually proven to be a very useful tool to recall information. e.g When did I goto Berlin? What was that beach called that we went to in Bali?
Technologies used: Leaflet, php, TileMill
Pokemon Go Map
About: This is a map used to visualise data about Pokemon spotted in Bath. The user can look at the distribution of individual or the most common Pokemon using heatmaps, icons or sprites.
Technologies used: Leaflet, php, SQLite
Royal College of Midwives – Better Births Initiative
About: This UK wide map was produced for the Royal College of Midwives Better Births Initiative. It shows various indicators (deprivation, birth rates, population density etc) as well as maternity units. The website was to be hosted externally so MBtiles and geojson were used to store the data and a custom php MBtile server was used so the site could function without the aid of external services.
Technologies used: Leaflet, TileMill, php and jQuery
About: This responsive web app allows the user to easily explore and compare historical maps from various years against a present day map from OpenStreetMap. It also includes locations of historical plaques and listed buildings.
Technologies used: Leaflet, jQuery, CSS
Bath:Hacked 2.1 – BathAlerts
About: This was a team entry in the 2nd Bath:Hacked event. As a team of 4 we produced an email alert service to inform local residents of what is happening in their local area. The monthly email alert lists any new planning applications, house sales or crimes committed within the user-defined area within the past month. The service also sends out daily alert email should the Environment Agency issue a flood alert in the users area.
Technologies used: PHP, HTML5, Sass, jQuery, MySQL and Leaflet.
Bath:Hacked – Recyclotron
We wanted to see if there were any obvious trends or patterns in the recycling data collected by the council as well as to breakdown and display this data in an attractive and easy to understand way which would hopefully encourage people to recycle even more!
Technologies used: We used an open source GIS stack starting with QGIS to spatialise, analyse and combine recycling, postcode and ONS census datasets. The results were then stored in a PostGIS database which was served up by Geoserver to be consumed by a Leaflet map embedded in an a webpage built with AngularJS.
Bath MapMyRun GPS routes
About: I collected around 1,000 GPS running routes from MapMyRun.com and plotted them together to form this crowd sourced map of Bath.
Technologies used: MapInfo, MapTiler and OpenLayers
About: This map was part of the ThinkABC campaign by the NHS which aimed to help people choose the correct service to use when injured or feeling unwell. The map shows the locations of the various A&E and minor injury units in the Bristol area as well as the opening times and contact details in a themed popup matching the campaign branding.
Technologies used: Leaflet
URL: http://www.thinkabc.org.uk/map.aspx (Now offline)
Malaysia Airlines MH370 Infographic
About: Ok not quite a map, it’s more an infographic. I was curious as to how deep below the ocean surface the MH370 might be. So I made this interactive and animated infographic at a scale of 1 foot per pixel which highlights the extreme depths of the ocean at the suspected location of the MH370.
Technologies used: jQuery, CSS