Vuejs and mapbox

Your tasks

Integrate Mapbox into your Vue.js project

• Install mapbox-gl using the module bundler option.
• Create a view in your project.
• Import mapbox-gl in your view.
• Create a lifecycle hook for mounted and intialize a map.
• Create an access token for your your Netlify url and for localhost.
• Load a new stylesheet into your project.

Add a gpx-track to your map using Contentful

• Extend a content type with a reference for a file where can put the gpx file.
• Upload a gpx track file to your Contentful and link it in your content.
• Display the track on your map using following this guide. You can use this utility module to extract the coordinates for Mapbox.
• There is a sample solution.