我如何在 React Native Mapview 中设置标记答案

【问题标题】：How I set Markers in React Native Mapview我如何在 React Native Mapview 中设置标记
【发布时间】：2019-03-13 07:33:13
【问题描述】：

我正在使用react-native-maps，我有地图显示以及我当前的纬度和经度，但我不知道如何在地图中用经度和纬度显示标记。

经纬度代码：

callLocation(that){
navigator.geolocation.getCurrentPosition(
   (position) => {
      const currentLongitude = position.coords.longitude;
      const currentLatitude = position.coords.latitude;
      that.setState({ currentLongitude:currentLongitude });
      that.setState({ currentLatitude:currentLatitude });
   },
   (error) => alert(error.message),
   { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 }
);
that.watchID = navigator.geolocation.watchPosition((position) => {
    console.log(position);
    const currentLongitude = position.coords.longitude;
    const currentLatitude =  position.coords.latitude;
   that.setState({ currentLongitude:currentLongitude });
   that.setState({ currentLatitude:currentLatitude });
});}

地图代码：

<View style={styles.container}>
    <MapView
      style={styles.map}
      initialRegion={{
        latitude:  this.state.currentLatitude,
        longitude: this.state.currentLongitude,
        latitudeDelta: 0.0922,
        longitudeDelta: 0.0421,
      }}>
    </MapView>
  </View>

【问题讨论】：

标签： javascript reactjs google-maps react-native react-native-maps

【解决方案1】：

工作示例：

<MapView provider={Platform.OS === 'android' ? PROVIDER_GOOGLE : PROVIDER_DEFAULT}  // remove if not using Google Maps
 style={{width: '100%', height: FULL_SH*0.51, marginTop: 65*SH}}
  initialRegion={{
     latitude: this.state.myLat ? this.state.myLat : 38.4555,
     longitude: this.state.myLon ? this.state.myLon : 27.1199,
     latitudeDelta: 0.015,
     longitudeDelta: 0.0121}}>
    <MapView.Marker
       coordinate={{latitude: 38.4555, longitude: 27.1199}}
       title={'Deneme'}
     />
    <MapView.Marker
       onPress={() => this.setState({visible: true}) + setTimeout(() => alert(this.state.visible), 200)}
       description={'güzel mekan'}
       coordinate={{latitude: 38.4555, longitude: 27.1129}}
       title={'Deneme'}/>
</MapView>

【讨论】：

我正在使用您的代码，但它显示错误“TypeError : undefined is not an object(evalating '_reactNativeMaps.MapView.Marker)”
也许你有旧版本？我不知道，我使用它没有任何问题。

【解决方案2】：

您应该使用Marker 组件。

例子：

import { MapView, Marker } from 'react-native-maps';

<MapView
  style={styles.map}
  initialRegion={{
    latitude:  this.state.currentLatitude,
    longitude: this.state.currentLongitude,
    latitudeDelta: 0.0922,
    longitudeDelta: 0.0421,
  }}
>
  <Marker
    coordinate={{latitude: 40.741075, longitude: 74.0003317}}
    title={'title'}
    description={'description'}
  />
</MapView>

【讨论】：