Tracking movement of a car with vuejs

 logistics company is trying to improve it’s tracking page to ensure it’s

effective to their clients while monitoring their deliveries .

1. Assuming you receive the following locations from the partner app after 5

seconds .

-1.298982, 36.776811

-1.297459, 36.776747

-1.296193, 36.776726

-1.296097, 36.779236

-1.296151, 36.777637

-1.296215, 36.776693

-1.294252, 36.776586

-1.294048, 36.776790

-1.293973, 36.779118

-1.292622, 36.779075

-1.291844, 36.779049

Animate the ​ driver A​ movement from the first to last location on the Tracking Page

2. Add an info window above the rider image to show ​ driver’s A name and current

locations (use coordinate values).

3. Consider a scenario where ​ driver A whose at coordinate (-1.300355, 36.773850)

initially confirms a delivery and as from the tracking page the driver icon is seen

based on his current position . ​ Driver A later cancels the order 15 seconds later

after confirmation since the client was unreachable , the icon then disappears (as

from the Tracking Page) . The order is then dispatched and confirmed by ​ driver B

whose coordinate (-1.291879, 36.778389) 10 seconds later after it was cancelled .

Driver’s B​ icon based on the current position now appears on the Tracking Page.

Show this transition on the tracking page .

Consider the following :

The application should be web based .

Driver Image ​ https://images.sendyit.com/web_platform/vendor_type/top/2.svg

Tools :

Use the Vue.js Framework (highly recommended) or any Javascript based Frameworks

Tags: No tags