ola uber 类型的可拖动地图与本机反应

如何解决ola uber 类型的可拖动地图与本机反应

我想实现类似于 ola/uber 应用程序的地图，其中地图可拖动，标记位于屏幕中心，新的纬度和经度位于中心本身。

我通过使用假标记实现了这一目标。但是假标记的位置因设备而异，有时无法为我们提供正确的位置，从而提供准确的纬度，因为用户看到的位置与实际位置略有不同。

有时这种偏差会超过 400 米。

    const [latitudeDelta,setLatitudeDelta] = useState<number>(0.002);
      const [longitudeDelta,setLongitudeDelta] = useState<number>(0.002);
  const [region,setRegion] = useState({
          latitude: 32.123,//some random value
          longitude: -72.38948,//some random value
          latitudeDelta: latitudeDelta,longitudeDelta: longitudeDelta,

});

     const renderMap = () => {
    return (
      <MapView
        provider={PROVIDER_GOOGLE}
        style={{ height: mapHeight }}
        region={region}
        ref={_map}
        zoomEnabled={true}
        minZoomLevel={5}
        onRegionChangeComplete={(region) => _onRegionChangeComplete(region)}
        onDoublePress={_setMapDragging}
        onPanDrag={() => setMapDragging(true)}
      ></MapView>
    );
  };

     const renderMarker = () => {
    return (
      <View style={{left: '50%',marginLeft: -24,marginTop: -48,position: 'absolute',top: screenHeight / 3}}>
        <View style={{  backgroundColor: 'red',borderRadius: 10,height: 37,justifyContent: 'center',left: -50,alignItems: 'center',paddingLeft: 7,paddingRight: 8,marginBottom: '2%',}>
          <Text style={styles.markerText}>{string.addressSelection.MARKER_TEXT}</Text>
        </View>
        <Image style={{  height: 35,width: 35,resizeMode: 'contain',} source={FakeMarker} />
      </View>
    );
  };

      const _onRegionChangeComplete = (region: RegionObject) => {
      setRegion(region);
      setLatitude(Number(region?.latitude));
      setLongitude(Number(region?.longitude));
      //on map drag,hit the google api to get the address from lat-long
     
  };

任何线索将不胜感激。