We worked in a mixed team with people from other companies including experts from Northumbrian Water who had useful subject knowledge enabling us to understand the challenge at hand.
The goal of the challenge was to help the NWG fleet reach net zero emissions by 2027 and this isn’t as simple as just buying a load of EV vehicles and replacing the older ones. Some of the ideas that we looked at were:
After discussing these points, we decided that with the fleet data provided we would be able to create a map showing the vehicle locations. This could be used to visualise the journeys made and reduce emissions by simply encouraging vehicles to make detours and drop requested parts off on the way to other scheduled locations. It could also be used to visualise how many vehicles there are, where they are and where they’re causing the most pollution.
We would have liked to do some work with large data processing and some data analysis but due to time constraints we wanted to focus on the front end and get something that the judges could see as quickly as possible, so I decided to setup an app using Angular.
I have previously used AngularJS and thought it would be exciting to try and use the latest version and see how much it has changed. One day wasn’t long enough for me to fully explore all the new features, however, I did gain an understanding of the component system and how to pass data between components. I thought this was a huge improvement on old Angular as it encouraged code reusability and also helped with separating concerns.
Using Mapbox Studio it is then possible to style the map add filters and add criteria to the map styling, such as changing a marker’s colour based on an incident’s priority. Using Mapbox I managed to create the data visualisation without writing a single line of code.
The only task left to do was to pull the map in using an access token and unique Mapbox style URL and then program and design the interactions and popups. Mapbox uses WebGL to render and process the map data so it performs a lot better than a lot of legacy map frameworks that rely on DOM manipulation to display and move markers. It is worth noting that this may not work on older browsers.
It’s possible to change the map parameters quite easily using a bespoke query language which you can also use in Mapbox studio but for the purposes of the demo this wasn’t necessary. If I had to point out one annoyance I had with Mapbox it is that it uses the format LngLat instead of LatLng which caught me out when I was trying to centre the map around Newcastle and ended up in northern Brazil to my own confusion!
There were some amazing ideas and insights, and I was impressed at how well the teams all managed to take the data, and output useful insights and headline statistics out of it. We were incredibly proud that our project won a prize for ‘Best Visualisation’ against high-quality competitors, whose projects I’m sure will benefit Northumbrian Water in its goal to be carbon neutral.
Overall if I had to describe the Innovation Festival in a few words, I would say that it was a “breath of fresh air”. It was good to be able to step away and have the chance to think outside the box and find an inventive solution. Words like “innovation” and “creativity” were being thrown around a lot and for good reason as there were many great ideas and projects being developed at the festival.
Loading...