Camera followUserLocation={true} possible interaction with UserLocation at app start

[Tiropz]

Hello,
I'm building an app with a MapView and I'd like to have the camera centered on the user and following him when the map first load.
But I'm encountering weird behaviour when followUserLocation is set to true at start and that UserLocation is used

What is the problem

The map will load and I can move it around and the UserLocation is displayed correctly but the Camera won't be centered on the user position and be center on some random point in Africa ( (0,0) maybe ?). Then the UserLocation will update, calling onUpdate, and the camera will then be centered on the user. Sometimes this flow can take up to 1 min or more.

Link to a video that I hope you can access, showing the issue :
https://github.com/Tiropz/Tiropz/blob/main/363439962_6464920006907379_8923571196012967067_n.mp4

What have I tested

If I remove the UserLocation element, I do not have this problem anymore. The camera will be centered on the user coordinates and follow the user.

If I set followingUser to false, it will juste show me the whole globe, with the UserLocation still being displayed correctly of course.

My code

Here is my code :

import Mapbox, { MarkerView, PointAnnotation, UserLocationRenderMode, UserTrackingMode, ShapeSource, Images, LineLayer, ImageSource, UserLocation, MapView, MapState } from '@rnmapbox/maps';

const [followingUser, setFollowingUser] = useState(true);
const [customStyle, setCustomStyle] = useState(`mapbox://styles/tiropz/clgvdgisx007g01quecyz9yb1?fresh=true&t=${new Date().getTime()}`); // THIS STYLE IS THE STANDARD STREET STYLE

const onCameraChanged = async () => {
   const currentZoom = await map.current?.getZoom();
   if (currentZoom != zoom) {
     setZoom(currentZoom)
   }
 }



<Mapbox.MapView
       ref={map}
       styleURL={customStyle}
       style={styles.mapContainer}
       scaleBarEnabled={false}
       logoEnabled={false}
       compassEnabled={true}
       compassFadeWhenNorth={false}
       onTouchMove={onMapInteraction}
       onDidFinishLoadingStyle={() => console.log("loaded style")}
       onPress={handleIpClose}
       onMapIdle={() => console.log("IDDDDLEE")}
       onDidFinishLoadingMap={() => console.log("finish")}
       attributionEnabled={false}
       onCameraChanged={onCameraChanged}
       compassPosition={{ top: Platform.OS === 'ios' ? 80 : 90, right: 15 }}
     >
      <Camera ref={camera}
         followUserLocation={followingUser}
         followUserMode={UserTrackingMode.Follow}
         animationMode={'flyTo'}
         followZoomLevel={17}
       />
     <UserLocation
         androidRenderMode={'gps'}
         renderMode={UserLocationRenderMode.Normal}
         showsUserHeadingIndicator={true}
         visible={true}
         onUpdate={() => console.log("render")}
         requestsAlwaysUse={true}
         minDisplacement={3}
         animated={true}
       />
  </Mapbox.MapView>

What I want

To do understand how the UserLocation can influence the behaviour of the Camera when loading the MapView

@mfazekas I'm not sure this can be classified as a Bug, if so please tell me and I'll move it to the Bug section

Thank you all for your time !

[Tiropz]

Current workaround is to use conditional rendering for the UserLocation element :

  const [showUser, setShowUser] = useState(false); 

<Mapbox.MapView
        ref={map}
        styleURL={customStyle}
        style={styles.mapContainer}
        onMapIdle={() => {
          setShowUser(true);
      }}
      >
     <Camera ref={camera}
          followUserLocation={followingUser}
          followUserMode={UserTrackingMode.Follow}
          animationMode={'flyTo'}
          followZoomLevel={17}
        />
     {showUser && (<UserLocation
          androidRenderMode={'gps'}
          renderMode={UserLocationRenderMode.Normal}
          showsUserHeadingIndicator={true}
          visible={true}
          onUpdate={() => console.log("render")}
          requestsAlwaysUse={true}
          minDisplacement={3}
          animated={true}
        />)}

</MarkerView>

But this will display the UserLocation only if it's updated which is not a problem on the device if handheld and with userheading enabled.

[mfazekas]

@Tiropz sorry I cannot see the video on that link - I get URL signature expired. Yes please submit a bug report. Also note that the first gps position may take a while to be received, so until that is received the app might show the default (0,0) location. You might save the last visible user location and use as centerCoordinate in defaultSettings, to show that until we have a valid gps position

[Tiropz]

Thank you for your reply, I'll open a bug report. I'm almost sure this is not a problem with the first gps position as the UserLocation onUpdate is called when the view shows and it still takes time before the camera moves. If I remove the UserLocation element from the MapView and let followUserLocation to true, the view loads almost instantaneously and the camera will follow the user but the user location won't be displayed.