rnmapbox / maps

A Mapbox react native module for creating custom maps
MIT License
2.27k stars 849 forks source link

[Bug]: UserLocation doesn't work with other GeoLocation Services (Android) #2717

Closed 0xcD3v closed 1 year ago

0xcD3v commented 1 year ago

Mapbox Implementation

Mapbox

Mapbox Version

10

Platform

Android

@rnmapbox/maps version

10.0.0-beta.11

Standalone component to reproduce

import { StyleSheet, View ,Text,PermissionsAndroid, SafeAreaView} from 'react-native';
import Mapbox, {UserLocationRenderMode} from '@rnmapbox/maps'
import { useEffect, useState } from "react";

export function Map(){

  const [location,setLocation] = useState(null);
  const [hasLocationPermissions,sethasLocationPermissions] = useState(false)

  const requestLocationPermission = async  () => 
  {
    try {
      const granted = await PermissionsAndroid.request(
        PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,

      )
      if (granted === PermissionsAndroid.RESULTS.GRANTED) {
        sethasLocationPermissions(true)
        console.log("You can use the location")
        alert("You can use the location");
      } else {
        console.log("location permission denied")
        alert("Location permission denied");
      }
    } catch (err) {
      console.warn(err)
    }
  }

  useEffect(()=>{
      requestLocationPermission()
  },[])

    return(
        <SafeAreaView style={styles.container}>
             <Mapbox.MapView style={styles.map} >
              <Mapbox.PointAnnotation
                draggable={true}
                onDragEnd={feature => {
                  console.log(feature);
                  setLocation({
                    latitude: feature.geometry.coordinates[1],
                    longitude: feature.geometry.coordinates[0],
                  });
                }}
                coordinate={ [
                  -1.510311133796023,
                  53.816142903704616
                        ]}
              >
             <View style={{
                height: 30,
                width: 30,
                backgroundColor: '#00cccc',
                borderRadius: 50,
                borderColor: '#fff',
                borderWidth: 3
                }} />

              </Mapbox.PointAnnotation>

                    <Mapbox.UserLocation
                    visible={true}
                    androidRenderMode={'compass'}
                    showsUserHeadingIndicator={true}
                    onUpdate={newLocation => {
                      console.log(newLocation)
                    }}
                />

        </Mapbox.MapView>
        </SafeAreaView>
    )
}

Observed behavior and steps to reproduce

This started when i switched to mac os, i have a project with rnmapbox and react-native-geolocation-service in linux android was working fine with both i could get updates from UserLocation but in mac os that doesn't work anymore so i tried to figure out what was wrong, i started a new project and i could get update locations without react-native-geolocation-service installed, so i installed another lib @react-native-community/geolocation and still happens the same the UserLocation didn't work anymore, i only can work with UserLocation on android without any geolocation lib.

Expected behavior

No response

Notes / preliminary analysis

No response

Additional links and references

No response

mfazekas commented 1 year ago

@0xcD3v I don't see 3rd party service in this example. Also what does doesn't work means, please be specific?

0xcD3v commented 1 year ago

@0xcD3v I don't see 3rd party service in this example. Also what does doesn't work means, please be specific?

I don't need to call the 3rd party service on the code it just stoped works by having it installed. i change the location on simulator the user location component doesn't move, the onUpdate function doesn't get triggered. i tried on a physical device and happens the same it only work's in IOS

Portion of my package.json

Screenshot 2023-03-18 at 11 34 00

my build.gradle

Screenshot 2023-03-18 at 11 40 27

and i also have the api key on gradle.properties

i installed @rnmapbox via yarn using this command: yarn add "rnmapbox/maps#main"

0xcD3v commented 1 year ago

@mfazekas i did a video showing what's happening

https://user-images.githubusercontent.com/128076064/226107993-1f30bd84-009b-476a-9178-9bdc6a228b7e.mov

0xcD3v commented 1 year ago

@mfazekas hey, do you have updates about this issue? Do you need more information?

mfazekas commented 1 year ago

@0xcD3v Sorry it's a community project, with limited resources.

FrancoisVA commented 1 year ago

Hi, I'm experiencing the same issue. The UserLocation component's onUpdate function only fires once (on load) but doesn't fire again when the user location changes. Only occurs on Android.

I've tested on #main (latest MapBox version) and on 10.0.0-beta.76 and both had this issue. I will try older Beta versions now to see if one works.

To test, I'm building to my android device and then updating the location using the 'GPS emulator' app for Android, I find that this is the easiest and most reliable way to test the actual behaviour.

mfazekas commented 1 year ago

@FrancoisVA thanks, are you also using other location services?

FrancoisVA commented 1 year ago

@FrancoisVA thanks, are you also using other location services?

I am using "react-native-geolocation-service": "5.3.1"

FrancoisVA commented 1 year ago

@ mfazekas I tested on 10.0.0-beta.69, and the issue is not present there. There might be a more recent build (between 10.0.0-beta.69 and 10.0.0-beta.74) that also works, but I haven't had time to test on more versions.

0xcD3v commented 1 year ago

@ mfazekas I tested on 10.0.0-beta.69, and the issue is not present there. There might be a more recent build (between 10.0.0-beta.69 and 10.0.0-beta.74) that also works, but I haven't had time to test on more versions.

I tried go to that version and the issue is still present for me.

"yarn add @rnmapbox/maps@10.0.0-beta.69"

FrancoisVA commented 1 year ago

@ mfazekas I tested on 10.0.0-beta.69, and the issue is not present there. There might be a more recent build (between 10.0.0-beta.69 and 10.0.0-beta.74) that also works, but I haven't had time to test on more versions.

I tried go to that version and the issue is still present for me.

"yarn add @rnmapbox/maps@10.0.0-beta.69"

@0xcD3v I think it might be a cache issue with your package or something, but I don't know enough about RN to help you. Try deleting all packages and re-installing and cleaning the project I guess. I tried on 10.0.0-beta.70 and that works as well.

@mfazekas it looks like this issue is present on all versions after 10.0.0-beta.70, I guess some change between 70 and 71 is wat caused the issue. Please let me know if this is something you will be able to resolve or if we will have to get rid of the other geolocation packages.

0xcD3v commented 1 year ago

@ mfazekas I tested on 10.0.0-beta.69, and the issue is not present there. There might be a more recent build (between 10.0.0-beta.69 and 10.0.0-beta.74) that also works, but I haven't had time to test on more versions.

I tried go to that version and the issue is still present for me. "yarn add @rnmapbox/maps@10.0.0-beta.69"

@0xcD3v I think it might be a cache issue with your package or something, but I don't know enough about RN to help you. Try deleting all packages and re-installing and cleaning the project I guess. I tried on 10.0.0-beta.70 and that works as well.

@mfazekas it looks like this issue is present on all versions after 10.0.0-beta.70, I guess some change between 70 and 71 is wat caused the issue. Please let me know if this is something you will be able to resolve or if we will have to get rid of the other geolocation packages.

@FrancoisVA Is working for me now the 10.0.0-beta.70

mfazekas commented 1 year ago

@FrancoisVA thank for checking looking at the diff of 70 and 71 https://github.com/rnmapbox/maps/compare/v10.0.0-beta.70...v10.0.0-beta.71 I see that mapbox was bumped to 10.11.1 If you can check if downgrading the mapbox libs with RNMapboxImpl as describe in docs helps or not:

https://github.com/rnmapbox/maps/blob/main/android/install.md#using-non-default-mapbox-version

 RNMapboxMapsLibs = {
            implementation 'com.mapbox.maps:android:10.10.0'
            implementation 'com.mapbox.mapboxsdk:mapbox-sdk-turf:6.10.0'
        }
0xcD3v commented 1 year ago

@FrancoisVA thank for checking looking at the diff of 70 and 71 v10.0.0-beta.70...v10.0.0-beta.71 I see that mapbox was bumped to 10.11.1 If you can check if downgrading the mapbox libs with RNMapboxImpl as describe in docs helps or not:

https://github.com/rnmapbox/maps/blob/main/android/install.md#using-non-default-mapbox-version

 RNMapboxMapsLibs = {
            implementation 'com.mapbox.maps:android:10.10.0'
            implementation 'com.mapbox.mapboxsdk:mapbox-sdk-turf:6.10.0'
        }

@mfazekas I tried to do that, and the problem persists i updated to /maps-10.0.0-rc.8 and on ios i was unable to install " rnmapbox-maps (from ../node_modules/@rnmapbox/maps) was resolved to 10.0.0-rc.8, which depends on MapboxMaps (~> 10.12.0)"

(update): -> i could resolve the problem of ios by pod update.

-> idk if the problem is cache of project or not, but i already removed the node modules, yarn clean cache, watchman clean and still persists

->Another issue i spotted it is when we open the app for the first time on android and i ask for permission the user location throws an error even if i accept the permisions, that isue doesn't occur on ios.

FrancoisVA commented 1 year ago

@FrancoisVA thank for checking looking at the diff of 70 and 71 v10.0.0-beta.70...v10.0.0-beta.71 I see that mapbox was bumped to 10.11.1 If you can check if downgrading the mapbox libs with RNMapboxImpl as describe in docs helps or not:

https://github.com/rnmapbox/maps/blob/main/android/install.md#using-non-default-mapbox-version

 RNMapboxMapsLibs = {
            implementation 'com.mapbox.maps:android:10.10.0'
            implementation 'com.mapbox.mapboxsdk:mapbox-sdk-turf:6.10.0'
        }

Hi @mfazekas, sorry for the late reply. I tried jumping back onto rnmapbox/maps#main and setting the specific mapbox version in build.gradle, but the issue is still present. Did you see anything else that might cause the issue when you looked at the diff?

Eagleames commented 1 year ago

This is also a problem I have been seeing intermittently for more than a year with our build. No one has been able to fix it so far; currently working with someone to try to build a work around for this case. Any help in solving this would be amazing for us!

0xcD3v commented 1 year ago

hey guys from the same component i provide here, i have another issue on IOS physical device. INVALID react tag, could not find RCTMGLMapView

Gavin-PunchCard commented 1 year ago

It looks like there might be a solution found in another bug report by wen-kai: https://github.com/rnmapbox/maps/issues/2543#issuecomment-1467447377

I added useEffect(() => {MapboxGL.locationManager.start()},[]} to the area's I'm using the MapboxGL.UserLocation and it seems to have fixed the issue for me.

lowiebenoot commented 1 year ago

I'm having the same issue, but adding useEffect(() => {MapboxGL.locationManager.start()},[]} doesn't seem to do the trick for me.

Downgraded to 10.0.0-beta.70 and then it works again.

juspriet commented 1 year ago

Still the same problem with last v10.0.4 !

emoreno-94 commented 1 year ago

The same problem in v10.0.6. I tested with 10.0.0-beta.70 and the location works but I need to use sdf icons and in these version doesn't work

KiwiKilian commented 1 year ago

Throughout this issue there are quite a few different/unclear problems stated. Therefore it's hard to determine, who is confirming which problem. I figured at least one specific case described by @FrancoisVA in our app too:

The UserLocation component's onUpdate function only fires once (on load) but doesn't fire again when the user location changes. Only occurs on Android.

To further clarify, the puck on the map does not update for normal render mode (either custom children or the default from rnmapbox). Using native render mode will give a moving puck. For both render modes onUpdate is only triggered once. I'm on the #main Branch equivalent to v10.0.7-rc.1.

This occurs due to no displacement beeing passed. So anyone who's experiencing the aforementioned problem, please try the following:

       <MapboxGL.UserLocation
          minDisplacement={1}
          renderMode={UserLocationRenderMode.Normal}
          onUpdate={() => console.log("location changed")}
        />

Please give feedback πŸ‘ πŸ‘Ž if this workaround works (only if you are experiencing this very same problem). You should be seeing a moving puck and getting "location changed" regularly, if you are simulating/moving your location.

@mfazekas sadly I'm still not able to reproduce the bug in the example. I can only recreate it in our expo project. Through prebuild I added error logging to the LocationManager onFailure which gave the following error:

com.mapbox.common.location.compat.LocationEngineException: invalid displacement: -1.0
        at com.mapbox.common.location.compat.LocationEngineImpl$notifyConsumersError$lambda-1$$inlined$postOrCall$1.run(LocationEngineImpl.kt:361)
        at android.os.Handler.handleCallback(Handler.java:883)
        at android.os.Handler.dispatchMessage(Handler.java:100)
        at android.os.Looper.loop(Looper.java:214)
        at android.app.ActivityThread.main(ActivityThread.java:7356)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:492)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:930)

So under some circumstances when displacement is passed as -1.0 Mapbox SDK throws an error.

kassemitani commented 1 year ago

Thank you @KiwiKilian This workaround worked for us, now UserLocation being updated on Android.

      <MapboxGL.UserLocation
          minDisplacement={1}
          renderMode={UserLocationRenderMode.Normal}
        />

Throughout this issue there are quite a few different/unclear problems stated. Therefore it's hard to determine, who is confirming which problem. I figured at least one specific case described by @FrancoisVA in our app too:

The UserLocation component's onUpdate function only fires once (on load) but doesn't fire again when the user location changes. Only occurs on Android.

To further clarify, the puck on the map does not update for normal render mode (either custom children or the default from rnmapbox). Using native render mode will give a moving puck. For both render modes onUpdate is only triggered once. I'm on the #main Branch equivalent to v10.0.7-rc.1.

This occurs due to no displacement beeing passed. So anyone who's experiencing the aforementioned problem, please try the following:

       <MapboxGL.UserLocation
          minDisplacement={1}
          renderMode={UserLocationRenderMode.Normal}
          onUpdate={() => console.log("location changed")}
        />

Please give feedback πŸ‘ πŸ‘Ž if this workaround works (only if you are experiencing this very same problem). You should be seeing a moving puck and getting "location changed" regularly, if you are simulating/moving your location.

@mfazekas sadly I'm still not able to reproduce the bug in the example. I can only recreate it in our expo project. Through prebuild I added error logging to the LocationManager onFailure which gave the following error:

com.mapbox.common.location.compat.LocationEngineException: invalid displacement: -1.0
        at com.mapbox.common.location.compat.LocationEngineImpl$notifyConsumersError$lambda-1$$inlined$postOrCall$1.run(LocationEngineImpl.kt:361)
        at android.os.Handler.handleCallback(Handler.java:883)
        at android.os.Handler.dispatchMessage(Handler.java:100)
        at android.os.Looper.loop(Looper.java:214)
        at android.app.ActivityThread.main(ActivityThread.java:7356)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:492)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:930)

So under some circumstances when displacement is passed as -1.0 Mapbox SDK throws an error.

yahyalrq commented 1 year ago

I encountered a similar error. Using react-native-geolocation-service 5.3.1 and rnmapbox v10.0.0-beta.64, there was no error. However when I added firebase as a dependency com.google.gms:google-services:4.3.15 I had the error Invalid Displacement -1,0 setSmallestDisplacement() with reference to the firebase dependency I had just installed. The error was related to using the userlocation in rnmpabox, which I fixed by upgrading to version 10.0.0-beta.69 !

Tiropz commented 1 year ago

Throughout this issue there are quite a few different/unclear problems stated. Therefore it's hard to determine, who is confirming which problem. I figured at least one specific case described by @FrancoisVA in our app too:

The UserLocation component's onUpdate function only fires once (on load) but doesn't fire again when the user location changes. Only occurs on Android.

To further clarify, the puck on the map does not update for normal render mode (either custom children or the default from rnmapbox). Using native render mode will give a moving puck. For both render modes onUpdate is only triggered once. I'm on the #main Branch equivalent to v10.0.7-rc.1.

This occurs due to no displacement beeing passed. So anyone who's experiencing the aforementioned problem, please try the following:

       <MapboxGL.UserLocation
          minDisplacement={1}
          renderMode={UserLocationRenderMode.Normal}
          onUpdate={() => console.log("location changed")}
        />

Please give feedback πŸ‘ πŸ‘Ž if this workaround works (only if you are experiencing this very same problem). You should be seeing a moving puck and getting "location changed" regularly, if you are simulating/moving your location.

@mfazekas sadly I'm still not able to reproduce the bug in the example. I can only recreate it in our expo project. Through prebuild I added error logging to the LocationManager onFailure which gave the following error:

com.mapbox.common.location.compat.LocationEngineException: invalid displacement: -1.0
        at com.mapbox.common.location.compat.LocationEngineImpl$notifyConsumersError$lambda-1$$inlined$postOrCall$1.run(LocationEngineImpl.kt:361)
        at android.os.Handler.handleCallback(Handler.java:883)
        at android.os.Handler.dispatchMessage(Handler.java:100)
        at android.os.Looper.loop(Looper.java:214)
        at android.app.ActivityThread.main(ActivityThread.java:7356)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:492)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:930)

So under some circumstances when displacement is passed as -1.0 Mapbox SDK throws an error.

Had the issue and setting minDisplacement={0} solved it. In doc, it is still said that default is 0 !

muhammadshaheer-er commented 1 year ago

Using Mapbox version 10.0.0-beta.70 does not make a difference for me. I am using "react-native-background-geolocation": "^4.10.0",

anyone found other solutions?

Tiropz commented 1 year ago

Using Mapbox version 10.0.0-beta.70 does not make a difference for me. I am using "react-native-background-geolocation": "^4.10.0",

anyone found other solutions?

I'm using import {UserLocation} from '@rnmapbox/maps; and <UserLocation androidRenderMode={'gps'} renderMode={UserLocationRenderMode.Native} showsUserHeadingIndicator={true} visible={true} requestsAlwaysUse={true} minDisplacement={1} animated={true} />

And it works fine

andrei-tofan commented 1 year ago

Adding minDisplacement={1} worked for us, I've also opened an issue in the react-native-background-geolocation https://github.com/transistorsoft/react-native-background-geolocation/issues/1802 and the maintainer of that project said that is possible something about the issue may be related to the ability of rnmapbox to consume 'free' location updates.