capacitor-mapbox-navigation

This is a plugin for mapbox navigation tested with capacitor 3.

Android implementation has not been done yet, Only ios version has been developed.

RoadMap

• Bridge event binding.
• Android Implementation

Install

First you will need to generate token over Mapbox.

Configure your secret token.

Your secret token enables you to download the SDK directly from Mapbox. To use your secret token, you will need to store it in a .netrc file in your home directory (not your project folder). This approach helps avoid accidentally exposing your secret token by keeping it out of your application's source code. Depending on your environment, you may have this file already, so check first before creating a new one.

The .netrc file is a plain text file that is used in certain development environments to store credentials used to access remote servers. The login should always be mapbox. It should not be your personal username used to create the secret token. To set up the credentials required to download the SDK, add the following entry to your .netrc file:

machine api.mapbox.com
login mapbox
password YOUR_SECRET_MAPBOX_ACCESS_TOKEN

To configure your public access token, open your project's Info.plist file and add a MBXAccessToken key whose value is your public access token.

npm install capacitor-mapbox-navigation
npx cap sync

Permission

In order for the SDK to track the user’s location as they move along the route, set NSLocationWhenInUseUsageDescription to:

Shows your location on the map and helps improve the map.

Users expect the SDK to continue to track the user’s location and deliver audible instructions even while a different application is visible or the device is locked. Go to the Signing & Capabilities tab. Under the Background Modes section, enable “Audio, AirPlay, and Picture in Picture” and “Location updates”. (Alternatively, add the audio and location values to the UIBackgroundModes array in the Info tab.)

API

• echo(...)
• show(...)
• history()
• Interfaces

echo(...)

echo(options: { value: string; }) => Promise<{ value: string; }>

Param	Type
options	{ value: string; }

Returns: Promise<{ value: string; }>

---

show(...)

show(options: MapboxNavOptions) => Promise<void>

Param	Type
options	MapboxNavOptions

---

history()

history() => Promise<any>

Returns: Promise<any>

---

Interfaces

MapboxNavOptions

Prop	Type
routes	LocationOption[]
mapType	string

LocationOption

Prop	Type
latitude	number
longitude	number