Comment définir un marqueur dans MapView de React Native
- Je veux placer un marqueur sur MapView dans React Native, mais je ne trouve aucune information dans les documents officiels de MapView .
- Si ce n'est pas autorisé de cette façon, comment puis-je utiliser le module React existant tel que react-googlemaps in React Native?
Vous pouvez définir des marqueurs en utilisant la propriété annotations
prop.
Par exemple:
var markers = [
{
latitude: 45.65,
longitude: -78.90,
title: 'Foo Place',
subtitle: '1234 Foo Drive'
}
];
<MapView
region={...}
annotations={markers}
/>
Merci @naoufal. Enfin, je suis capable d'afficher des marqueurs sur la carte pour réagir IOS natif.
<View style={styles.container}>
<MapView style={styles.map}
initialRegion={{
latitude: 37.78825,
longitude: -122.4324,
latitudeDelta: 0.0,
longitudeDelta: 0.0,
}}
>
<MapView.Marker
coordinate={{latitude: 37.78825,
longitude: -122.4324}}
title={"title"}
description={"description"}
/>
</MapView>
</View>
Pour les styles de carte et de conteneur, j'ai utilisé les styles suivants:
var styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
map: {
position: 'absolute',
top: 0,
left: 0,
right: 0,
bottom: 0,
}
});
J'ai fait référence au lien suivant: React native IOS- Afficher les marqueurs sur la carte
Selon ce problème , il n'est pas encore exposé. Vous ne pourrez pas non plus utiliser le package web-React, React Native ne fonctionne pas comme ça.
Deux suggestions:
- Attendez que le problème ci-dessus soit résolu pour obtenir une API appropriée
- Essayez d'utiliser WebView pour créer un lien vers une carte Google avec une annotation
Cependant, je ne suis pas certain que le # 2 soit possible.