Intended Audience: Marija Bezbradica (FYP Supervisor)
Made progress with:
- Overcoming issue resulting in map being drawn without markers.
Recently I’ve struggled with an unusual bug concerned with Google Maps. When a user navigated to the page that ‘journey-map’ page by clicking a hyperlink the map would remain blank. Although if the user refreshed the page the makers would be added to the page after it was reloaded.
I couldn’t make sense of the issue while debugging it. The request for the points was showing up in the server logs and I was even able to log the points to the console. The thing that made the issue so difficult to debug was that every now and then the points would load on the page as expected. While this was a rare occurrence it made me doubt my systematic approach to troubleshooting.
When a request is made for a resource using Angular a promise is used as sort of a placeholder for the data that is to be returned. When the controller was being called I was immediately drawing the map. This resulted in the map being drawn before the promise was resolved resulting in a blank map, yet the points were still being logged to the console.
The solution to this problem was very quick to implement but one that required a thorough understanding of how angular interacts with an external service. I changed the behaviour of the controller to only add the points to the map after the promise had been resolved. This instantly solved the problem that I had spent days troubleshooting.