maps
maps copied to clipboard
[Bug]: UserLocation & LineLayer disappearing when adding RasterLayer
Mapbox Implementation
Mapbox
Mapbox Version
default
Platform
iOS, Android
@rnmapbox/maps version
10.1.13
Standalone component to reproduce
import React, {useState} from 'react';
import {
Pressable,
Platform,
Text,
View
} from 'react-native';
import Mapbox from '@rnmapbox/maps';
const App = () => {
const [userLocationPermission,setUserLocationPermission] = useState((Platform.OS == 'android')?false:true);
React.useEffect(() => {
if (Platform.OS == 'android') { Mapbox.requestAndroidLocationPermissions().then(setUserLocationPermission); }
}, []);
const [showRaster, setShowRaster] = React.useState(false);
return (
<>
<Mapbox.MapView style={{flex:1}}>
{ (showRaster) &&
<Mapbox.RasterSource key={"tile"+ Date.now() } id={"tile"} tileUrlTemplates={["https://tile.openstreetmap.de/{z}/{x}/{y}.png"]} tileSize={256}>
<Mapbox.RasterLayer
id={"tileLayer"}
sourceID={"tile"}
style={{ rasterOpacity: 1 }}
/>
</Mapbox.RasterSource>
}
{userLocationPermission &&
<Mapbox.UserLocation showsUserHeadingIndicator={true} />
}
<Mapbox.ShapeSource id="shapesource" lineMetrics={true} shape={{
type: 'Feature',
geometry: {
type: 'LineString',
coordinates: [[-75,41],[13,53]],
},
}}
>
<Mapbox.LineLayer id="linelayer" style={{
lineColor: '#007AFF',
lineCap: 'round',
lineJoin: 'round',
lineWidth: 5,
}} />
</Mapbox.ShapeSource>
<Mapbox.MarkerView
id={"marker"}
coordinate={[-75,41]}
anchor={{ x: 0.5, y: 0.5 }}
allowOverlap={true}
>
<Text>❌</Text>
</Mapbox.MarkerView>
</Mapbox.MapView>
<View style={{position: "absolute", bottom: 100, zIndex: 200}}>
<Pressable onPress={() => { setShowRaster(!showRaster); }} style={{backgroundColor: 'orange',padding: 20}}><Text style={{fontSize: 20, fontWeight: "bold"}}>PRESS HERE TO CHANGE MAP</Text></Pressable>
</View>
</>
);
}
export default App;
Observed behavior and steps to reproduce
Click button to show openstreetmap tile layer and watch the linelayer & userlocation disappear. the markerview stays on the map.
(line is from new york to berlin)
Expected behavior
linelayer and userlocation should stay
Notes / preliminary analysis
No response
Additional links and references
No response