A navigation UI ready to drop into your React Native application

License: MIT License

Kotlin 56.18% Objective-C 8.40% Swift 8.60% Ruby 5.55% TypeScript 2.28% JavaScript 7.95% Starlark 0.95% Java 9.93% C 0.16%

react-native mapbox mapbox-navigation navigation

react-native-mapbox-navigation's People

Contributors

Stargazers

Watchers

Forkers

nomaanp shahraizali nitinsh99 freesbee-app cargorocket trendingtechnology epavlov sparelabs vlkpa nazosnare rideos heyrio bduyng geronimoktt nobodyabcd uhspot goluter rmdevtorres eugenebakhmetiev fabbydogo1 emmanuel-umeh fnmutua zhangchi svmmym iraticasi dslapelis dealmachine raikasdev havens joachimamoah thispastwinter bradenpowers nurassyl maeyazzi jackjblundell jimhill fullstackuu adrianj98 mirzahayat hamzaashfaq65 jorgequevedoc chargetrip vitaliykreminskiy jomar17 jls-digital gourav-singhal squareborg ahmedtehseen tech-newurtopia nick92 abdurahmonk farruxx vgno blaisetransit jamesvovos samueltremko yashiroiori admin-bfd bmilagre holler-jason holler-services bartlomiejlechowski drive-app sdenom01 cadaeix comediadesign yemioajayi mikepotvin jmstechnologiesinc shreypdev wenge8n noelcastillon1 renjithdiginest christopherldo soymonitus a396901990 ori-app-studio shan-lak code-fi panosmz karelnguyen mckeny3 webessentials routebuddies omnicpie craigmulligan rapid-medical teamspiel gremech micaiah-effiong taylbm ayberkanilatsiz alexey-janz mzafra-navagis wpi-ecotarium-mqp aleksandar-argead manishsainju adhendo kazakovkirilliy jxeeno

react-native-mapbox-navigation's Issues

Could not find compatible version for pod "@react-native-mapbox-gl-mapbox-static"

After following all the steps before doing pod install

I am getting below:

[!] CocoaPods could not find compatible versions for pod "@react-native-mapbox-gl-mapbox-static":
In Podfile:
react-native-mapbox-gl (from ../node_modules/@react-native-mapbox-gl/maps) was resolved to 8.1.0, which depends on
@react-native-mapbox-gl-mapbox-static (~> 5.9.0)

react-native-mapbox-navigation (from `../node_modules/@homee/react-native-mapbox-navigation`) was resolved to 1.0.2, which depends on
  @react-native-mapbox-gl-mapbox-static (= 6.3.0)

Expose RouteProgress Information in onProgressChange Event

Thank you for your library. We were wondering if you could expose some of values of the RouteProgress in the navigationViewController didUpdate method? We need at least the primitives: distanceTraveled, durationRemaining, fractionTraveled, and distanceRemaining. These are the iOS names for those values, and I'm unfamiliar with what they would be on the Android side.

These would be exposed as extra parameters to the onProgressChange callback, alongside latitude and longitude. Let me know if I can assist (at least with the iOS side).

Task :app:checkDebugDuplicateClasses FAILED

My requirements -

Show trip location on a map (I am using mapbox here Package: @react-native-mapbox-gl/maps )
After selecting the trip redirect user to the navigation screen to navigate them the route. ( Package : @homee/react-native-mapbox-navigation )

Problems:
After installing @homee/react-native-mapbox-navigation package I am getting error - Task :app:checkDebugDuplicateClasses FAILE

Task :app:processDebugMainManifest
[org.maplibre.gl:android-sdk:9.2.1] C:\Users\User.gradle\caches\transforms-2\files-2.1\cb126c41afa09cae71e62245cc1a9660\jetified-android-sdk-9.2.1\AndroidManifest.xml Warning:
Package name 'com.mapbox.mapboxsdk' used in: org.maplibre.gl:android-sdk:9.2.1, com.mapbox.mapboxsdk:mapbox-android-sdk:9.6.1.

> Task :homee_react-native-mapbox-navigation:compileDebugKotlin
w: F:\SUKKAS\codebaseNew\Sukkas_new\Sukkas\node_modules@homee\react-native-mapbox-navigation\android\src\main\java\com\homee\mapboxnavigation\MapboxNavigationView.kt: (196, 30): Unnecessary safe call on a non-null receiver of type MapboxNavigation
w: F:\SUKKAS\codebaseNew\Sukkas_new\Sukkas\node_modules@homee\react-native-mapbox-navigation\android\src\main\java\com\homee\mapboxnavigation\MapboxNavigationView.kt: (202, 30): Unnecessary safe call on a non-null receiver of type MapboxNavigation

I dont know what is going on here but as per my app requirements I have use both package.

Please help me. Please....

Unable to resolve dependency tree

Getting dependency error while running "npm install @homee/react-native-mapbox-navigation" command

iOS Unimplemented methods

While starting the navigator I get couple of logs for different delegate methods. Is this something that is required?

[delegation.TopBannerViewController] Unimplemented delegate method in TopBannerViewController: NavigationServiceDelegate.navigationService(_:willArriveAt:after:distance:). This message will only be logged once.

[delegation.BottomBannerViewController] Unimplemented delegate method in BottomBannerViewController: NavigationServiceDelegate.navigationService(_:willArriveAt:after:distance:). This message will only be logged once.

[delegation.TopBannerViewController] Unimplemented delegate method in TopBannerViewController: NavigationServiceDelegate.navigationService(_:didPassSpokenInstructionPoint:routeProgress:). This message will only be logged once.

[delegation.RouteMapViewController] Unimplemented delegate method in RouteMapViewController: NavigationServiceDelegate.navigationService(_:shouldRerouteFrom:). This message will only be logged once.

[delegation.TopBannerViewController] Unimplemented delegate method in TopBannerViewController: NavigationServiceDelegate.navigationService(_:shouldRerouteFrom:). This message will only be logged once.

[delegation.BottomBannerViewController] Unimplemented delegate method in BottomBannerViewController: NavigationServiceDelegate.navigationService(_:shouldRerouteFrom:). This message will only be logged once.

[delegation.MapboxNavigationView] Unimplemented delegate method in MapboxNavigationView: NavigationViewControllerDelegate.navigationViewController(_:shouldRerouteFrom:). This message will only be logged once.

iOS build - Having issues building it alongwith @react-native-mapbox-gl/maps package!

Hi! have you tried building the app which has both of these packages @react-native-mapbox-gl/maps and @homee/react-native-mapbox-navigation need help with it.

Metric system

I would need metric for my implementation.
https://stackoverflow.com/questions/60814316/how-to-change-the-distance-format-of-mapbox-navigation-sdk-from-imperial-to-metr shows some type of how to make that.
Thanks

Android Build Issue

I am getting below error while building the app on android

Unable to resolve dependency for ':homee_react-native-mapbox-navigation@debug/compileClasspath': Could not resolve com.mapbox.navigation:core:1.3.0.

Ability to add marker inside the navigation view

Hi.. I would like to request a feature where we can add custom markers inside the navigation view..
Something along these lines : mapbox/mapbox-navigation-android#999

Is this something that can be considered to be added to this package.

Thanks

Wrong Language

Hi @rossmartin. Forgive you, I am so burdened with you.

Different languages appear in different places. Could it be possible to add language settings? Or at least can it be done in fixed English?

Allow custom bottom banner for Navigation

Hello! I was curious if it was possible to allow for custom banners on the MapBox screen. We were looking to change the style of the arrival time, distance, etc. and it doesn't seem there is any such property exposed. We found a (really gross) way to display our own bottom banner that involves position: 'absolute' but it would be much better if there was a prop instead.

Doesn't render anything

I made a build for android but the screen was blank. Couldn't see the map

  return (
    <View style={styles.container}>
      <MapboxNavigation
        origin={[-97.760288, 30.273566]}
        destination={[-97.918842, 30.494466]}
        onLocationChange={event => {
          const { latitude, longitude } = event.nativeEvent
          console.log('UUUUUUUUUUUUUUUUUUUUUUUuu', event.nativeEvent)
        }}
        onMapReady={event => {
          console.log('UUUUUUUUUUUUUUUUUUUUUUUuu', event.nativeEvent)
        }}
        onRouteProgressChange={event => {
          const {
            distanceTraveled,
            durationRemaining,
            fractionTraveled,
            distanceRemaining
          } = event.nativeEvent
          console.log('LLLLLLLLLLLLLLLLLLLLLLLL', event.nativeEvent)
        }}
        onError={event => {
          const { message } = event.nativeEvent
          console.error(message)
        }}
        onCancelNavigation={() => {
          // User tapped the "X" cancel button in the nav UI
          // or canceled via the OS system tray on android.
          // Do whatever you need to here.
        }}
        onArrive={() => {
          // Called when you arrive at the destination.
        }}
      />
    </View>
  )

setup:

android/buid.gradle

allprojects {
    repositories {
        mavenLocal()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url("$rootDir/../node_modules/react-native/android")
        }
        maven {
            // Android JSC is installed from npm
            url("$rootDir/../node_modules/jsc-android/dist")
        }

        google()
        jcenter()

        maven { url 'https://maven.google.com' }

        maven { url 'https://www.jitpack.io' }

        maven {
            url 'https://api.mapbox.com/downloads/v2/releases/maven'
            authentication {
                basic(BasicAuthentication)
            }
            credentials {
                // Do not change the username below.
                // This should always be `mapbox` (not your username).
                username = "mapbox"
                // Use the secret token you stored in gradle.properties as the password
                password = "hardcoded_secret_token" ?: ""
            }
        }
    }
}

main/AndroidManifest.xml

        <!-- This should be a child of the application tag -->
        <meta-data android:name="MAPBOX_ACCESS_TOKEN"
            android:value="hardcoded_public_token" />

[!] An error occurred while processing the pre-install hook of the Podfile.

Hello and good day,

Working with my development team we ran into this issue when installing pods with the latest version of your package:

`[!] An error occurred while processing the pre-install hook of the Podfile.

undefined method `pre_install' for nil:NilClass

/Library/Ruby/Gems/2.6.0/gems/cocoapods-core-1.10.1/lib/cocoapods-core/podfile.rb:162:in pre_install!' /Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer.rb:869:in run_podfile_pre_install_hook'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer.rb:857:in block in run_podfile_pre_install_hooks' /Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/user_interface.rb:145:in message'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer.rb:856:in run_podfile_pre_install_hooks' /Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer.rb:254:in block in download_dependencies'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/user_interface.rb:64:in section' /Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer.rb:252:in download_dependencies'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer.rb:161:in install!' /Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/command/install.rb:52:in run'
/Library/Ruby/Gems/2.6.0/gems/claide-1.0.3/lib/claide/command.rb:334:in run' /Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/command.rb:52:in run'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/bin/pod:55:in <top (required)>' /usr/local/bin/pod:23:in load'
/usr/local/bin/pod:23:in <main>'

As a temporary fix for anyone running into this issue we just rolled back to version 1.0.7, but it would be nice to know the right way to work with the latest version if there is any.

Thank you.

Custom directions API url

Hi guys,
we want to avoid of using Mapbox directions API, so we created our own directions API (with graphhopper and maphopper as proxy). Do you think that it would by possible to connect our api url to react-native-mapbox-navigation at the end? I tried to add our api url to baseUrl in MapboxNavigationView.kt for android, but RouteOptions builder creates different url format (we can create mapper for this url format in our maphopper). Do you think, that it would be possible to do same in swift? Also we want to customize vehicle type (foot, cycle...), at this point it is possible to navigate only with car as vehicle. With url prop for custom directions API url it would be possible to customize more options for directions routes (maybe?). Do you think, that it would be technically possible to create mapper for this url in react-native-mapbox-navigation?
Example url from maphopper:
http://localhost:3000/api/1/route?point=40.72,-74&vehicle=car&locale=en&key=[GH_ACCESSTOKEN]&points_encoded=false&point=40.733,-73.989&mapboxkey=[MB_ACCESS_TOKEN]

How to Integrate with Carplay

I'm trying to create a Carplay navigation app and this seems to imply theres support for it. Does anyone know how to accomplish this? Haven't been able to find instructions

Update the react to latest version its old making dependency conflicts

react@"17.0.2" from the root project

npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.8.1" from @homee/[email protected]
npm ERR! node_modules/@homee/react-native-mapbox-navigation
npm ERR! @homee/react-native-mapbox-navigation@"*" from the root project

Using --legacy-peer-deps would solve this problem but i don't want temporary fix

Android installation

implementation 'com.mapbox.navigation.core:1.1.0'
implementation 'com.mapbox.navigation:ui:1.5.0'

not working in android

gredle offline error show

What is issue please give me a solution

React-native version 0.64.2

Add onArrive prop

TODO: Add a prop called onArrive that takes a function to get called when the "End Navigation" button is pressed (or when navigation finishes transparently).

Xcode - Archiving the project will not show in Organizer

If I build the project and running it on real device or simulator everything is fine. But when I do Product -> Archivei t will complete the archive with success but the archive is not in Organizer. If I remove the package from package.json and cd ios && pod update and try again to archive it eveything is fine. Any reason?

Question on best practices for passing lat/long props...

Hello all, I was just wondering how everyone is using this library in their application and how they are handling the passing of the origin and destination props. Right now we are using react-native-geolocation-service with enableHighAccuracy set to true for the origin prop to get the users current location. What is everyone else using for this?

Also how is everyone passing in the lat/long array to this package? Passing in an object and converting it into an array? Directly passing in an array of the lat/long?

Thanks this would be a huge help!!

Error at the build of the app (Android)

Hello I have install the dependency, there was an error with dependency at the install so i made it with --legacy-peer-deps and now when i try to launch it i have this error https://gist.github.com/KillianPiccerelle/567dffb645ca48ba4ca9c4515b52c494
I try to do

cd android
.\gradlew clean
cd ..
npm cache clean --force

But nothing change.

Receiving Swift Compile Error: 'MapboxAccounts/MapboxAccounts.h' file not found

When I go to build the project after following the installation steps I receive a Swift Compile Error in xcode.

Xcode 12.3
RN 0.63.4

<module-includes>:1:9: note: in file included from <module-includes>:1:
#import "MapboxCoreNavigation-umbrella.h"
        ^
/../ios/Pods/Headers/Public/MapboxCoreNavigation/MapboxCoreNavigation-umbrella.h:13:9: note: in file included from /../ios/Pods/Headers/Public/MapboxCoreNavigation/MapboxCoreNavigation-umbrella.h:13:
#import "MapboxCoreNavigation.h"
        ^
/../ios/Pods/Headers/Public/MapboxCoreNavigation/MapboxCoreNavigation.h:9:9: note: in file included from /../ios/Pods/Headers/Public/MapboxCoreNavigation/MapboxCoreNavigation.h:9:
#import "MBXAccounts+CoreNavigationAdditions.h"
        ^
/../ios/Pods/Headers/Public/MapboxCoreNavigation/MBXAccounts+CoreNavigationAdditions.h:1:9: error: 'MapboxAccounts/MapboxAccounts.h' file not found
#import <MapboxAccounts/MapboxAccounts.h>
        ^
<unknown>:0: error: could not build Objective-C module 'MapboxCoreNavigation'

Any idea the cause of issue or if I'm missing a step?

React Native Mapbox - MapboxNavigation was not found in the UIManager

So I've been trying to integrate @homee/react-native-mapbox-navigation I've followed the install instructions found here https://github.com/homeeondemand/react-native-mapbox-navigation to the letter 3 times now. I continue to get the following error, this is from the simulator:

This is from the console:

Invariant Violation: requireNativeComponent: "MapboxNavigation" was not found in the UIManager.
 
 This error is located at:
     in MapboxNavigation (at react-native-mapbox-navigation/index.js:6)
     in MapboxNavigation (at ManifestScreen.tsx:37)
     in RCTView (at View.js:34)
     in View (at Themed.tsx:40)
     in View (at ManifestScreen.tsx:36)
     in RCTView (at View.js:34)
     in View (at Themed.tsx:40)
     in View (at ManifestScreen.tsx:25)
     in ManifestScreen (at SceneView.tsx:122)
     in StaticContainer
     in StaticContainer (at SceneView.tsx:115)
     in EnsureSingleNavigator (at SceneView.tsx:114)
     in SceneView (at useDescriptors.tsx:153)
     in RCTView (at View.js:34)
     in View (at CardContainer.tsx:245)
     in RCTView (at View.js:34)
     in View (at CardContainer.tsx:244)
     in RCTView (at View.js:34)
     in View (at CardSheet.tsx:33)
     in ForwardRef(CardSheet) (at Card.tsx:573)
     in RCTView (at View.js:34)
     in View (at createAnimatedComponent.js:165)
     in AnimatedComponent (at createAnimatedComponent.js:215)
     in ForwardRef(AnimatedComponentWrapper) (at Card.tsx:555)
     in PanGestureHandler (at GestureHandlerNative.tsx:13)
     in PanGestureHandler (at Card.tsx:549)
     in RCTView (at View.js:34)
     in View (at createAnimatedComponent.js:165)
     in AnimatedComponent (at createAnimatedComponent.js:215)
     in ForwardRef(AnimatedComponentWrapper) (at Card.tsx:544)
     in RCTView (at View.js:34)
     in View (at Card.tsx:538)
     in Card (at CardContainer.tsx:206)
     in CardContainer (at CardStack.tsx:619)
     in RCTView (at View.js:34)
     in View (at Screens.tsx:84)
     in MaybeScreen (at CardStack.tsx:612)
     in RCTView (at View.js:34)
     in View (at Screens.tsx:54)
     in MaybeScreenContainer (at CardStack.tsx:494)
     in CardStack (at StackView.tsx:462)
     in KeyboardManager (at StackView.tsx:458)
     in SafeAreaProviderCompat (at StackView.tsx:455)
     in RCTView (at View.js:34)
     in View (at StackView.tsx:454)
     in StackView (at createStackNavigator.tsx:87)
     in StackNavigator (at ManifestTabNavigator.tsx:60)
     in DirectionsNavigator (at SceneView.tsx:122)
     in StaticContainer
     in StaticContainer (at SceneView.tsx:115)
     in EnsureSingleNavigator (at SceneView.tsx:114)
     in SceneView (at useDescriptors.tsx:153)
     in RCTView (at View.js:34)
     in View (at BottomTabView.tsx:55)
     in SceneContent (at BottomTabView.tsx:172)
     in RCTView (at View.js:34)
     in View (at ResourceSavingScene.tsx:58)
     in RCTView (at View.js:34)
     in View (at ResourceSavingScene.tsx:41)
     in ResourceSavingScene (at BottomTabView.tsx:166)
     in RCTView (at View.js:34)
     in View (at src/index.native.js:123)
     in ScreenContainer (at BottomTabView.tsx:146)
     in RCTView (at View.js:34)
     in View (at BottomTabView.tsx:145)
     in SafeAreaProviderCompat (at BottomTabView.tsx:144)
     in BottomTabView (at createBottomTabNavigator.tsx:45)
     in BottomTabNavigator (at ManifestTabNavigator.tsx:19)
     in ManifestTabNavigator (at SceneView.tsx:122)
     in StaticContainer
     in StaticContainer (at SceneView.tsx:115)
     in EnsureSingleNavigator (at SceneView.tsx:114)
     in SceneView (at useDescriptors.tsx:153)
     in RCTView (at View.js:34)
     in View (at CardContainer.tsx:245)
     in RCTView (at View.js:34)
     in View (at CardContainer.tsx:244)
     in RCTView (at View.js:34)
     in View (at CardSheet.tsx:33)
     in ForwardRef(CardSheet) (at Card.tsx:573)
     in RCTView (at View.js:34)
     in View (at createAnimatedComponent.js:165)
     in AnimatedComponent (at createAnimatedComponent.js:215)
     in ForwardRef(AnimatedComponentWrapper) (at Card.tsx:555)
     in PanGestureHandler (at GestureHandlerNative.tsx:13)
     in PanGestureHandler (at Card.tsx:549)
     in RCTView (at View.js:34)
     in View (at createAnimatedComponent.js:165)
     in AnimatedComponent (at createAnimatedComponent.js:215)
     in ForwardRef(AnimatedComponentWrapper) (at Card.tsx:544)
     in RCTView (at View.js:34)
     in View (at Card.tsx:538)
     in Card (at CardContainer.tsx:206)
     in CardContainer (at CardStack.tsx:619)
     in RCTView (at View.js:34)
     in View (at Screens.tsx:84)
     in MaybeScreen (at CardStack.tsx:612)
     in RCTView (at View.js:34)
     in View (at Screens.tsx:54)
     in MaybeScreenContainer (at CardStack.tsx:494)
     in CardStack (at StackView.tsx:462)
     in KeyboardManager (at StackView.tsx:458)
     in SafeAreaProviderCompat (at StackView.tsx:455)
     in RCTView (at View.js:34)
     in View (at StackView.tsx:454)
     in StackView (at createStackNavigator.tsx:87)
     in StackNavigator (at navigation/index.tsx:45)
     in RootNavigator (at navigation/index.tsx:29)
     in EnsureSingleNavigator (at BaseNavigationContainer.tsx:409)
     in ForwardRef(BaseNavigationContainer) (at NavigationContainer.tsx:91)
     in ThemeProvider (at NavigationContainer.tsx:90)
     in ForwardRef(NavigationContainer) (at navigation/index.tsx:26)
     in Navigation (at App.tsx:18)
     in RNCSafeAreaProvider (at SafeAreaContext.tsx:74)
     in SafeAreaProvider (at App.tsx:17)
     in App (created by ExpoRoot)
     in ExpoRoot (at renderApplication.js:45)
     in RCTView (at View.js:34)
     in View (at AppContainer.js:106)
     in DevAppContainer (at AppContainer.js:121)
     in RCTView (at View.js:34)
     in View (at AppContainer.js:132)
     in AppContainer (at renderApplication.js:39)
 - node_modules/react-native/Libraries/LogBox/LogBox.js:148:8 in registerError
 - node_modules/react-native/Libraries/LogBox/LogBox.js:59:8 in errorImpl
 - node_modules/react-native/Libraries/LogBox/LogBox.js:33:4 in console.error
 - node_modules/expo/build/environment/react-native-logs.fx.js:27:4 in error
 - node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
 - node_modules/react-native/Libraries/Core/ExceptionsManager.js:171:19 in handleException
 - node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:6 in handleError
 - node_modules/expo-error-recovery/build/ErrorRecovery.fx.js:9:32 in ErrorUtils.setGlobalHandler$argument_0
 - node_modules/regenerator-runtime/runtime.js:63:36 in tryCatch
 - node_modules/regenerator-runtime/runtime.js:293:29 in invoke
 - node_modules/regenerator-runtime/runtime.js:63:36 in tryCatch
 - node_modules/regenerator-runtime/runtime.js:154:27 in invoke
 - node_modules/regenerator-runtime/runtime.js:164:18 in PromiseImpl.resolve.then$argument_0
 - node_modules/react-native/node_modules/promise/setimmediate/core.js:37:13 in tryCallOne
 - node_modules/react-native/node_modules/promise/setimmediate/core.js:123:24 in setImmediate$argument_0
 - node_modules/react-native/Libraries/Core/Timers/JSTimers.js:130:14 in _callTimer
 - node_modules/react-native/Libraries/Core/Timers/JSTimers.js:181:14 in _callImmediatesPass
 - node_modules/react-native/Libraries/Core/Timers/JSTimers.js:441:30 in callImmediates
 - node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:387:6 in __callImmediates
 - node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:135:6 in __guard$argument_0
 - node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:364:10 in __guard
 - node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:134:4 in flushedQueue
 * [native code]:null in flushedQueue
 * [native code]:null in invokeCallbackAndReturnFlushedQueue
 
 Invariant Violation: requireNativeComponent: "MapboxNavigation" was not found in the UIManager.
 
 This error is located at:
     in MapboxNavigation (at react-native-mapbox-navigation/index.js:6)
     in MapboxNavigation (at ManifestScreen.tsx:37)
     in RCTView (at View.js:34)
     in View (at Themed.tsx:40)
     in View (at ManifestScreen.tsx:36)
     in RCTView (at View.js:34)
     in View (at Themed.tsx:40)
     in View (at ManifestScreen.tsx:25)
     in ManifestScreen (at SceneView.tsx:122)
     in StaticContainer
     in StaticContainer (at SceneView.tsx:115)
     in EnsureSingleNavigator (at SceneView.tsx:114)
     in SceneView (at useDescriptors.tsx:153)
     in RCTView (at View.js:34)
     in View (at CardContainer.tsx:245)
     in RCTView (at View.js:34)
     in View (at CardContainer.tsx:244)
     in RCTView (at View.js:34)
     in View (at CardSheet.tsx:33)
     in ForwardRef(CardSheet) (at Card.tsx:573)
     in RCTView (at View.js:34)
     in View (at createAnimatedComponent.js:165)
     in AnimatedComponent (at createAnimatedComponent.js:215)
     in ForwardRef(AnimatedComponentWrapper) (at Card.tsx:555)
     in PanGestureHandler (at GestureHandlerNative.tsx:13)
     in PanGestureHandler (at Card.tsx:549)
     in RCTView (at View.js:34)
     in View (at createAnimatedComponent.js:165)
     in AnimatedComponent (at createAnimatedComponent.js:215)
     in ForwardRef(AnimatedComponentWrapper) (at Card.tsx:544)
     in RCTView (at View.js:34)
     in View (at Card.tsx:538)
     in Card (at CardContainer.tsx:206)
     in CardContainer (at CardStack.tsx:619)
     in RCTView (at View.js:34)
     in View (at Screens.tsx:84)
     in MaybeScreen (at CardStack.tsx:612)
     in RCTView (at View.js:34)
     in View (at Screens.tsx:54)
     in MaybeScreenContainer (at CardStack.tsx:494)
     in CardStack (at StackView.tsx:462)
     in KeyboardManager (at StackView.tsx:458)
     in SafeAreaProviderCompat (at StackView.tsx:455)
     in RCTView (at View.js:34)
     in View (at StackView.tsx:454)
     in StackView (at createStackNavigator.tsx:87)
     in StackNavigator (at ManifestTabNavigator.tsx:60)
     in DirectionsNavigator (at SceneView.tsx:122)
     in StaticContainer
     in StaticContainer (at SceneView.tsx:115)
     in EnsureSingleNavigator (at SceneView.tsx:114)
     in SceneView (at useDescriptors.tsx:153)
     in RCTView (at View.js:34)
     in View (at BottomTabView.tsx:55)
     in SceneContent (at BottomTabView.tsx:172)
     in RCTView (at View.js:34)
     in View (at ResourceSavingScene.tsx:58)
     in RCTView (at View.js:34)
     in View (at ResourceSavingScene.tsx:41)
     in ResourceSavingScene (at BottomTabView.tsx:166)
     in RCTView (at View.js:34)
     in View (at src/index.native.js:123)
     in ScreenContainer (at BottomTabView.tsx:146)
     in RCTView (at View.js:34)
     in View (at BottomTabView.tsx:145)
     in SafeAreaProviderCompat (at BottomTabView.tsx:144)
     in BottomTabView (at createBottomTabNavigator.tsx:45)
     in BottomTabNavigator (at ManifestTabNavigator.tsx:19)
     in ManifestTabNavigator (at SceneView.tsx:122)
     in StaticContainer
     in StaticContainer (at SceneView.tsx:115)
     in EnsureSingleNavigator (at SceneView.tsx:114)
     in SceneView (at useDescriptors.tsx:153)
     in RCTView (at View.js:34)
     in View (at CardContainer.tsx:245)
     in RCTView (at View.js:34)
     in View (at CardContainer.tsx:244)
     in RCTView (at View.js:34)
     in View (at CardSheet.tsx:33)
     in ForwardRef(CardSheet) (at Card.tsx:573)
     in RCTView (at View.js:34)
     in View (at createAnimatedComponent.js:165)
     in AnimatedComponent (at createAnimatedComponent.js:215)
     in ForwardRef(AnimatedComponentWrapper) (at Card.tsx:555)
     in PanGestureHandler (at GestureHandlerNative.tsx:13)
     in PanGestureHandler (at Card.tsx:549)
     in RCTView (at View.js:34)
     in View (at createAnimatedComponent.js:165)
     in AnimatedComponent (at createAnimatedComponent.js:215)
     in ForwardRef(AnimatedComponentWrapper) (at Card.tsx:544)
     in RCTView (at View.js:34)
     in View (at Card.tsx:538)
     in Card (at CardContainer.tsx:206)
     in CardContainer (at CardStack.tsx:619)
     in RCTView (at View.js:34)
     in View (at Screens.tsx:84)
     in MaybeScreen (at CardStack.tsx:612)
     in RCTView (at View.js:34)
     in View (at Screens.tsx:54)
     in MaybeScreenContainer (at CardStack.tsx:494)
     in CardStack (at StackView.tsx:462)
     in KeyboardManager (at StackView.tsx:458)
     in SafeAreaProviderCompat (at StackView.tsx:455)
     in RCTView (at View.js:34)
     in View (at StackView.tsx:454)
     in StackView (at createStackNavigator.tsx:87)
     in StackNavigator (at navigation/index.tsx:45)
     in RootNavigator (at navigation/index.tsx:29)
     in EnsureSingleNavigator (at BaseNavigationContainer.tsx:409)
     in ForwardRef(BaseNavigationContainer) (at NavigationContainer.tsx:91)
     in ThemeProvider (at NavigationContainer.tsx:90)
     in ForwardRef(NavigationContainer) (at navigation/index.tsx:26)
     in Navigation (at App.tsx:18)
     in RNCSafeAreaProvider (at SafeAreaContext.tsx:74)
     in SafeAreaProvider (at App.tsx:17)
     in App (created by ExpoRoot)
     in ExpoRoot (at renderApplication.js:45)
     in RCTView (at View.js:34)
     in View (at AppContainer.js:106)
     in DevAppContainer (at AppContainer.js:121)
     in RCTView (at View.js:34)
     in View (at AppContainer.js:132)
     in AppContainer (at renderApplication.js:39)
 - node_modules/react-native/Libraries/LogBox/LogBox.js:148:8 in registerError
 - node_modules/react-native/Libraries/LogBox/LogBox.js:59:8 in errorImpl
 - node_modules/react-native/Libraries/LogBox/LogBox.js:33:4 in console.error
 - node_modules/expo/build/environment/react-native-logs.fx.js:27:4 in error
 - node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
 - node_modules/react-native/Libraries/Core/ExceptionsManager.js:171:19 in handleException
 - node_modules/react-native/Libraries/Core/ReactFiberErrorDialog.js:43:2 in showErrorDialog
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:15257:32 in logCapturedError
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:15361:20 in logError
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:16597:12 in update.callback
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:7106:2 in callCallback
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:7127:20 in commitUpdateQueue
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:15801:25 in commitLifeCycles
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18744:22 in commitLayoutEffects
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:265:4 in invokeGuardedCallbackImpl
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:476:2 in invokeGuardedCallback
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18483:29 in commitRootImpl
 * [native code]:null in commitRootImpl
 - node_modules/scheduler/cjs/scheduler.development.js:653:23 in unstable_runWithPriority
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18317:17 in commitRoot
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:17697:12 in performSyncWorkOnRoot
 * [native code]:null in performSyncWorkOnRoot
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5321:31 in runWithPriority$argument_1
 - node_modules/scheduler/cjs/scheduler.development.js:653:23 in unstable_runWithPriority
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5316:21 in flushSyncCallbackQueueImpl
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5304:28 in flushSyncCallbackQueue
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:17718:28 in batchedUpdates$1
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2492:29 in batchedUpdates
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2638:16 in _receiveRootNodeIDEvent
 - node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2767:27 in receiveTouches
 - node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:416:4 in __callFunction
 - node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:109:6 in __guard$argument_0
 - node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:364:10 in __guard
 - node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:108:4 in callFunctionReturnFlushedQueue
 * [native code]:null in callFunctionReturnFlushedQueue

This is code for the file where I am trying to use the mapbox package:

 import * as React from 'react';
 
 import { Text, View } from '../components/Themed';
 import styles from '../components/styles';
 import {Ionicons} from '@expo/vector-icons';
 import {Image} from 'react-native';
 
 import MapboxNavigation from '@homee/react-native-mapbox-navigation';
 
 export default function ManifestScreen() {
   return (
     <View style={styles.padlessContainer}>
         <MapboxNavigation
           origin={[-97.760288, 30.273566]}
           destination={[-97.918842, 30.494466]}
           shouldSimulateRoute={true}
           onLocationChange={(event: any) => {
             const { latitude, longitude } = event.nativeEvent;
           }}
           onRouteProgressChange={(event: any) => {
             const {
               distanceTraveled,
               durationRemaining,
               fractionTraveled,
               distanceRemaining,
             } = event.nativeEvent;
           }}
           onError={(event: any) => {
             const { message } = event.nativeEvent;
           }}
           onCancelNavigation={() => {
             // User tapped the "X" cancel button in the nav UI
             // or canceled via the OS system tray on android.
             // Do whatever you need to here.
           }}
           onArrive={() => {
             // Called when you arrive at the destination.
           }}
         />
     </View>
   );
 }

I checked and made sure I had the correct native extensions installed in my /ios/pods directory:

I also made sure I had all the needed packages installed in the node_modules:

I also seen this issue, which seemed similar so I tried to autolink the missing package that was listed in the simulator errors:

https://stackoverflow.com/questions/60034686/react-native-rncsafeareaview-was-not-found-in-the-uimanager#answer-61329389

That didn't help either, I've been trouble shooting for 3-4 days trying to get this resolved, any help would be greatly appreciated!!!

Errors after unmount component (Android only)

Hello @rossmartin ,
On Android, when I run onCancelNavigation or close the page. It gives errors while unmounting.
I think the problem will be resolved if the OnDestroy code is integrated. Can you fix this?

Only for real devices?

I was able to install the library for the android app following the steps. However while running on the emulator the map does not appear. So should it work on emulator or only on a real device? (I have not tested on a real device.)

Unable to install on IOS devices

Descriptions:

Installed following the instructions. build was successful, but this error popped up.

Xcode: Version 12.4 (12D4e)
iOS: 14.0.1

Error:

Details

Unable to install "test_mapbox"
Domain: com.apple.dt.MobileDeviceErrorDomain
Code: -402653103
--
Could not inspect the application package.
Domain: com.apple.dt.MobileDeviceErrorDomain
Code: -402653103
User Info: {
    DVTRadarComponentKey = 282703;
    MobileDeviceErrorCode = "(0xE8000051)";
    "com.apple.dtdevicekit.stacktrace" = (
	0   DTDeviceKitBase                     0x000000012d0e6c8f DTDKCreateNSErrorFromAMDErrorCode + 220
	1   DTDeviceKitBase                     0x000000012d125241 __90-[DTDKMobileDeviceToken installApplicationBundleAtPath:withOptions:andError:withCallback:]_block_invoke + 155
	2   DVTFoundation                       0x000000010a1fb64b DVTInvokeWithStrongOwnership + 71
	3   DTDeviceKitBase                     0x000000012d124f82 -[DTDKMobileDeviceToken installApplicationBundleAtPath:withOptions:andError:withCallback:] + 1440
	4   IDEiOSSupportCore                   0x000000012cf95a10 __118-[DVTiOSDevice(DVTiPhoneApplicationInstallation) processAppInstallSet:appUninstallSet:installOptions:completionBlock:]_block_invoke.292 + 3513
	5   DVTFoundation                       0x000000010a32a17e __DVT_CALLING_CLIENT_BLOCK__ + 7
	6   DVTFoundation                       0x000000010a32bda0 __DVTDispatchAsync_block_invoke + 1191
	7   libdispatch.dylib                   0x00007fff2023d5dd _dispatch_call_block_and_release + 12
	8   libdispatch.dylib                   0x00007fff2023e7c7 _dispatch_client_callout + 8
	9   libdispatch.dylib                   0x00007fff202445fe _dispatch_lane_serial_drain + 606
	10  libdispatch.dylib                   0x00007fff202450cb _dispatch_lane_invoke + 375
	11  libdispatch.dylib                   0x00007fff2024ec5d _dispatch_workloop_worker_thread + 819
	12  libsystem_pthread.dylib             0x00007fff203e6499 _pthread_wqthread + 314
	13  libsystem_pthread.dylib             0x00007fff203e5467 start_wqthread + 15
);
}
--


System Information

macOS Version 11.2.3 (Build 20D91)
Xcode 12.4 (17801) (Build 12D4e)
Timestamp: 2021-03-10T11:57:51-05:00

Updates:

This error doesn't when I built on simulator. Only happened on real devices.

Map is always taking default destination and origin which was given in usage

Map is still showing Stockton street

[Android] App crashed when I click the x icon on the bottom banner or navigate away from the navigation screen

Hi everyone,

I am facing issue with react-native-mapbox-navigation crashed as described in the title.

Basically I have a navigation component like this:

const OrderNavigationComponent = ({ order }) => {
  const navigation = useNavigation();

  const geoPoint = useShallowEqualSelector(
    (state) => state.systemReducer.geoPoint
  );

  const handleQuitNavigation = () => {
    if (navigation.canGoBack()) {
      navigation.goBack();
    } else {
      navigation.navigate(RouteName.OrderNavigator, {
        screen: RouteName.OrderDetail,
        params: {
          order,
        },
      });
    }
  };

  const origin = [geoPoint.longitude, geoPoint.latitude];
  const destination =
    order.orderStatus === OrderStatus.ACCEPTED
      ? [order.partner.geoPoint.longitude, order.partner.geoPoint.latitude]
      : [order.customer.geoPoint.longitude, order.customer.geoPoint.latitude];

  return (
    <View style={styles.container}>
      <MapboxNavigation
        origin={origin}
        destination={destination}
        shouldSimulateRoute={true}
        showsEndOfRouteFeedback
        onLocationChange={(event) => {
          const { latitude, longitude } = event.nativeEvent;
        }}
        onRouteProgressChange={(event) => {
          const {
            distanceTraveled,
            durationRemaining,
            fractionTraveled,
            distanceRemaining,
          } = event.nativeEvent;
        }}
        onError={(event) => {
          const { message } = event.nativeEvent;
          if (__DEV__) {
            console.log("Navigation error out with error: ", error);
          }
          // handleQuitNavigation();
        }}
        onCancelNavigation={() => {
          console.log("Cancel");
          handleQuitNavigation();
        }}
        onArrive={() => {}}
      />
    </View>
  );
};

When I click the x icon, it will invoke the handleQuitNavigation() where it will navigate to Order screen. However, what I experience is that it just crashed without any error thrown.

Have anyone experience the same thing before, and may know how to overcome this?

Errors after unmount component (Android only)

Hi!

I use react natigation to show the mapboxnavigation in a new screen, after press back button I have several errors in the console, I suppose the mapbox instance should be detroyed correctly before unmount the component.

[Sun Dec 13 2020 10:51:27.812]  ERROR    Mapbox error You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:27.850]  ERROR    Mapbox error You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:27.883]  ERROR    Mapbox error You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:27.907]  WARN     Mapbox warning Style is not fully loaded, not able to get source! {"level": "warning", "message": "Style is not fully loaded, not able to get source!", "tag": "mbgl-locationSymbol"}
[Sun Dec 13 2020 10:51:27.936]  ERROR    Mapbox error You're calling `getMetersPerPixelAtLatitude` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `getMetersPerPixelAtLatitude` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:27.967]  ERROR    Mapbox error You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:27.998]  ERROR    Mapbox error You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.370]  ERROR    Mapbox error You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.630]  ERROR    Mapbox error You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.900]  ERROR    Mapbox error You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.116]  ERROR    Mapbox error You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.146]  ERROR    Mapbox error You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.177]  ERROR    Mapbox error You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.204]  ERROR    Mapbox error You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.232]  ERROR    Mapbox error You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.263]  ERROR    Mapbox error You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.289]  ERROR    Mapbox error You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.316]  ERROR    Mapbox error You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
[Sun Dec 13 2020 10:51:28.350]  ERROR    Mapbox error You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}

Arrived banner still showing with showsEndOfRouteFeedback={false}

I would like to know how can we remove the arrived banner showing the rating and comment? We are using a custom modal for that and our flow is something like start the journey from current location to pickup point then from pickup point to destination. When I arrive to pickup point we don't want to show the banner with rating and comments. Also the End Navigation have no callback and we cannot hide that. Another thing is that if we change the destination point coordinates it will not update it on navigator only if we relaunch the navigator.

Can we have an update for react-native-mapbox-gl/maps?

We currently updated @react-native-mapbox-gl/maps to v8.2.1 and our app keeps crashing

Destination coordinates mixed

I was trying to run some tests with different locations and finally I figure out that the latitude and longitude are mixed up

let originWaypoint = Waypoint(coordinate: CLLocationCoordinate2D(latitude: origin[1] as! CLLocationDegrees, longitude: origin[0] as! CLLocationDegrees)) let destinationWaypoint = Waypoint(coordinate: CLLocationCoordinate2D(latitude: destination[1] as! CLLocationDegrees, longitude: destination[0] as! CLLocationDegrees))

Any reason for this?

I should expect origin=[latitude, longitude] and destination=[latitude, longitude]

Android: black items in map

Hi guys. Do you know why I'm seeing black item, even black pointer on android? It's working well on iOS but not on android

Could not find Some Dependencies

Could not find com.mapbox.navigation:ui:1.2.1.
Could not find com.mapbox.navigation:core:1.2.1.

Licensing issue due to upstream mapbox dependency

Thanks for providing this interesting project!

From my understanding it should be mentioned in the licensing file that the usage of this project falls under the Mapbox terms. See the license file of the upstream dependency (com.mapbox.navigation:core) version 1.3.0:

This SDK uses Mapbox Navigator, a private binary, as a dependency. The Mapbox Navigator binary may be used with a Mapbox account and under the Mapbox TOS. If you do not wish to use this binary, make sure you swap out this dependency in libandroid-navigation/build.gradle.

Please note that it is not trivial to "swap out" this dependency. Additionally Mapbox sends home information from which they say is anonymous (probably to create their traffic data).

And this license becomes effective even if you do not use their services and use some self-hosted map tiles.

And in the latest version of this upstream dependencies it get's fully closed source:

Mapbox Navigation for Android version 2.0 (“Mapbox Navigation Android SDK“) or higher must be used according to the Mapbox Terms of Service

I highlight this as I was hoping you found a solution for the problem we faced when we (GraphHopper) forked their navigation SDK before they went closed source a few years ago. This fork is now available under the MapLibre umrella - see a blog post of maptiler - one of the initiator about the reasoning of this org.

Loading style failed. Missing public access token?

I followed all instructions of the readme document.

It was neccesary to change the import of the example from:
import MapboxNavigation from 'react-native-mapbox-navigation';
To:
import MapboxNavigation from '@homee/react-native-mapbox-navigation';

After that, the app runs correctly without errors or warnings, but I only see an empty layout of the navigation:

Can we currently use custom map styles in react native/ iOS?

Looked through the code and didn't see any way for react native to consume a custom Mapbox map style Url for iOS.

Error on navigation back or open other app(Android)

Getting Error on android when going back or open another app, please help

Allow hiding of the Navigation Complete banner

Hello! Is it possible to add an option to hide the banner that shows up on route completion? We're looking to keep displaying the banner that's visible while the map is still navigating. In iOS there's a property to disable it that looks like showsReportFeedback = false

warning: already initialized constant Pod::TargetsToChangeToDynamic

Hey thanks in advance for the library. I'm trying to install it, but I'm getting an error trying to install the pods:

I'm following the steps and trying clean installs but without success.
Any ideas on this?
Thanks

Getting an event on clicking the cross icon?

how to get an event by clicking on that cross or is there any other way of closing it?

Thank You

Can we stop the navigation manually before reaching to final destination?

Have a warning

Hi @rossmartin. Navigation is working. First of all, thank you for your effort.
However, it gives a warning, is there a solution?

Mapbox warning Falling back to MGLIdeographsRasterizedLocally because MGLIdeographicFontFamilies are specified. {"filePath": "-[MGLRendererConfiguration glyphsRasterizationOptionsWithLocalFontFamilyName:rasterizationMode:]", "level": "warning", "line": 111, "message": "Falling back to MGLIdeographsRasterizedLocally because MGLIdeographicFontFamilies are specified."}

I also get such an error.
Mapbox error [event]:General [code]:-1 [message]:Unable to calculate appropriate zoom level for bounds. Vertical or horizontal padding is greater than map's height or width. {"filePath": "virtual bool mbgl::MGLCoreLoggingObserver::onRecord(mbgl::EventSeverity, mbgl::Event, int64_t, const std::string &)", "level": "error", "line": 30, "message": "[event]:General [code]:-1 [message]:Unable to calculate appropriate zoom level for bounds. Vertical or horizontal padding is greater than map's height or width."}

Finally, is it possible to set the language?

How would .netrc credentials work in production build?

Xcode build failure

Hi all, I am getting following error during xcode build after installing this package

ld: warning: building for iOS, but linking in dylib file (/Users/nitinsharma/Library/Developer/Xcode/DerivedData/app-bpqejjqomhurrldtyubqevqtdqzc/Build/Products/Debug-iphoneos/MapboxAccounts.framework/MapboxAccounts) built for Mac Catalyst
Undefined symbols for architecture arm64:
  "_swift_getFunctionReplacement", referenced from:
      _swift_getFunctionReplacement50 in libswiftCompatibilityDynamicReplacements.a(DynamicReplaceable.cpp.o)
     (maybe you meant: _swift_getFunctionReplacement50)
ld: symbol(s) not found for architecture arm64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

I am using

react-native : v0.63.0
xcode : 12.4

mapbox related pods from my podfile.lock
  - Mapbox-iOS-SDK (6.3.0):
    - MapboxMobileEvents (~> 0.10.4)
  - MapboxAccounts (2.3.1)
  - MapboxCommon (9.2.0)
  - MapboxCoreNavigation (1.2.1):
    - MapboxAccounts (~> 2.3.0)
    - MapboxDirections (~> 1.2.0)
    - MapboxMobileEvents (~> 0.10.2)
    - MapboxNavigationNative (~> 30.0)
    - Turf (~> 1.0)
  - MapboxDirections (1.2.0):
    - Polyline (~> 5.0)
    - Turf (~> 1.0)
  - MapboxMobileEvents (0.10.7)
  - MapboxNavigation (1.2.1):
    - Mapbox-iOS-SDK (~> 6.0)
    - MapboxCoreNavigation (= 1.2.1)
    - MapboxMobileEvents (~> 0.10.2)
    - MapboxSpeech (~> 1.0)
    - Solar (~> 2.1)
  - MapboxNavigationNative (30.0.0):
    - MapboxCommon (= 9.2.0)
  - MapboxSpeech (1.0.0)

MapboxMobileEvents - Library not loaded

My built was succeeded but when the app started on real device get the following

dyld: Library not loaded: @rpath/MapboxMobileEvents.framework/MapboxMobileEvents
  Referenced from: /private/var/containers/Bundle/Application/E108BAAA-D3FA-4D6D-99CE-B1A6AB844FD4/driverapp.app/Frameworks/Mapbox.framework/Mapbox
  Reason: image not found
dyld: launch, loading dependent libraries
DYLD_LIBRARY_PATH=/usr/lib/system/introspection
DYLD_INSERT_LIBRARIES=/Developer/usr/lib/libBacktraceRecording.dylib:/Developer/usr/lib/libMainThreadChecker.dylib:/Developer/Library/PrivateFrameworks/DTDDISupport.framework/libViewDebuggerSupport.dylib
(lldb)

Any idea what this could be? I want to say that I've followed all the steps in ReadMe and also the issue https://github.com/homeeondemand/react-native-mapbox-navigation/issues/6

installation error

npm notice
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR! react@"17.0.1" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.8.1" from @homee/[email protected]
npm ERR! node_modules/@homee/react-native-mapbox-navigation
npm ERR! @homee/react-native-mapbox-navigation@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

[Android] Fail when mount and unmount the navigation

I receive a bunch of same error logs when mounting unmounting the navigator

Mapbox error You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
 ERROR  Mapbox error You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
 ERROR  Mapbox error You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
 ERROR  Mapbox error You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
 ERROR  Mapbox error You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
 ERROR  Mapbox error You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
 ERROR  Mapbox error You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `cancelTransitions` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
 ERROR  Mapbox error You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `jumpTo` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}
 ERROR  Mapbox error You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`? {"level": "error", "message": "You're calling `getCameraValues` after the `MapView` was destroyed, were you invoking it after `onDestroy()`?", "tag": "Mbgl-NativeMapView"}

Any reason?

Pass custom routes directions to mapboxnavigation to be rendered on map

I am not sure if there is a way to pass routes to mapbox navigation map so it can be rendered instead of getting routes from mapbox routing API. I am getting routes from external routing API service. Does this library handle this? And if yes how can I pass routes?

Feature: make audio optional

Is there a configuration that allows audio to be optional or is possible to be added. In my certain situation we are finding that drivers quit navigation because they are annoyed by the sound.

homeeondemand / react-native-mapbox-navigation Goto Github PK