Trip planning tool

A Google Maps replica based on a custom map tile. Development of an application for a public transport company.

About a project

A Canadian transport company teamed up with UUUSoftware to build and implement a replica of Google Maps based on a custom map tile. The Client needed a map-featured application which would display the movement of the buses in real-time, as well as their routes, stops, and schedules.

The Client wanted to have a publicly accessable application to help passengers find out the real-time trip departure, a closest stop, or a schedule for the specific route number.

The assembled team included two senior-level developers from UUUSoftware. We used ArcGis viewer to build a responsive application based on Dojo javascript framework.

Client's challenges

  • The Client had a custom map tile for various zoom levels. It required to have a viewer to navigate and zoom-in/zoom-out as conveniently and user-friendly as in Google Maps.

  • We implemented an integration with YRT bus data that was available publicly.

  • Our goal was to display bus routes, stops, arrival schedule, and the buses moving right on top of the map.

  • The project required an integration with a proto-buff data format, that was not conventional for web applications without having an intermittent backend layer (everything was done at the front end).

Our solutions

UUUSoftware analyzed the relevant map viewer options to find the solution to display a custom map tile in a browser.

Our team chose a web tile viewer by ArcGis that they tried and made a Proof of Concept. Then, we integrated with the bus data source and decoded from the proto buff format right in the browser.

We also created efficient and custom logic to display bus locations, routes and even real-time bus locations with a refresh interval of 20 seconds.

The team spent three months on development of the required solution and implemented five complex integrations.

Project details

months of development
software developers
complex integrations

Tech Stack

  • ReactJS
  • JavaScript
  • TypeScript
  • JSX
  • Redux
  • SCSS
  • AJAX
  • Webpack
  • Microservices
  • .NET Core
  • REST
  • Entity framework
  • MassTransit
  • Kubernetes
  • Docker
QA tools
  • Cypress
  • Jest
  • Postman
DevOps tools
  • AWS
  • EC2 instances
  • GitLab