maplibre-react-native icon indicating copy to clipboard operation
maplibre-react-native copied to clipboard

UserLocation component and LocationManager not woking properly when new architecture is enabled

Open EmilJunker opened this issue 7 months ago • 2 comments
trafficstars

Describe and reproduce the Bug

When the new RN architecture is enabled on Android (I haven't tested this on iOS, so I don't know if that is also affected), the onUpdate callback of the UserLocation component does not get called when the location changes and the location puck on the map also doesn't move.

Minimum reproducable example:

import { Camera, Location, MapView, requestAndroidLocationPermissions, UserLocation } from '@maplibre/maplibre-react-native';
import React, { useEffect } from 'react';
import { StyleSheet } from 'react-native';

export const MapLibreWithLocation: React.FC = () => {
    useEffect(() => {
        requestAndroidLocationPermissions();
    }, []);

    const onLocationUpdate = (location: Location) => {
        console.log('LOCATION:', location);
    };

    return (
        <MapView style={styles.map}>
            <Camera />
            <UserLocation visible={true} minDisplacement={0} onUpdate={onLocationUpdate} />
        </MapView>
    );
};

const styles = StyleSheet.create({
    map: {
        flex: 1,
    },
});

The issue only happens when the new architecture is enabled. If I set newArchEnabled=false, the above component works properly and I can see the location updates in the log and the location puck is moving.

Note that MapLibre sometimes doesn't display the location puck on the map for some reason (in both the new and old architecture). However, I noticed that if I just insert a <Camera /> component into the MapView, it is always displays it reliably. Not sure if this is by design, it's just something I noticed and I can open a separate issue for this if needed.

Also note that there existed a pretty much identical issue over on rnmapbox which has since been fixed: https://github.com/rnmapbox/maps/issues/3681

@maplibre/maplibre-react-native Version

10.1.4

Which platforms does this occur on?

Android Device

Which frameworks does this occur on?

React Native

Which architectures does this occur on?

New Architecture

Environment

expo-env-info 1.2.2 environment info:
    System:
      OS: Windows 11 10.0.22631
    Binaries:
      Node: 20.18.0 - C:\Programs\node-v20.18.0-win-x64\node.EXE
      npm: 10.8.2 - C:\Programs\node-v20.18.0-win-x64\npm.CMD
    SDKs:
      Android SDK:
        API Levels: 23, 28, 30, 31, 33, 34, 35
        Build Tools: 28.0.3, 30.0.2, 30.0.3, 33.0.0, 34.0.0, 35.0.0
    npmPackages:
      react: 19.0.0 => 19.0.0
      react-native: 0.78.0 => 0.78.0
    Expo Workflow: bare

EmilJunker avatar Mar 25 '25 14:03 EmilJunker