Connect the dots between pickup and drop off locations

Thank you for your help ❤️

What is this project?

DAV (Decentralized Autonomous Vehicles) is a new foundation working to build an open-source infrastructure for autonomous vehicles (cars, drones, trucks, robots, and all the service providers around them) to communicate and transact with each other over blockchain.

The specific project you are looking at is Missions. Missions is the client facing side of the marketplace connecting DAV users looking to ship packages, with autonomous vehicles such as drones.

How you can help

When the mission ends the screen shows the map with some mission summary information. Modify the code so that when the summary screen is shown it will show a line connecting the coordinates of the dropoff and pickup locations.

Technically this means that in the MissionScreen - when mission is in complete state the Map need to show the line between pickup and dropoff.

The line needs to be colored #684BF1. (Bonus points if you can make the line a gradient that goes from #684BF1 to #34D6FA 😄 )

Note that the line needs to be rendered as part of the map. You can read more about adding elements to Mapbox GL JS (our mapping library) in the documentation: https://www.mapbox.com/mapbox-gl-js/example/data-driven-lines/

Contributing to Missions

• Make sure this issue is labeled up-for-grabs and not labeled claimed, to verify no one else is working on it.
• Comment in this issue that you would like to do it.
• Open the Missions GitHub page and click the ★ Star and then ⑂ Fork buttons.
• Clone a copy to your local machine with $ git clone [e-mail]:YOUR-GITHUB-USER-NAME/missions.git
• Make changes in the LICENSE file
• Once you’ve made sure all your changes work correctly and committed all your changes, push your local changes back to github with $ git push -u origin master
• Visit your fork on GitHub.com (https://github.com/YOUR-USER-NAME/missions) and create a pull request for your changes.
• Make sure your pull request describes exactly what you changed and references this issue (include the issue number in the title like this: #5)
• Please do not fix more than one issue at a time. Your pull request should only fix what is described in this issue.

[cg-cnu]

Hey @TiagoLisboa ! We are in the process of changing our branding and while you are working on this issue, can you change the color of the line to the hex value FF6A46 instead of the color mentioned above. It should look something like this…

[srfrnk]

Hey @TiagoLisboa - That’s great 🎉 Go ahead it’s yours!