React-native-maps限制平移区域 [英] React-native-maps limit panning area

问题描述

是否可以将地图限制为特定区域，以便将平移和缩放包含在该区域内，而将外部的所有内容都锁定住?我想限制用户可以在地图上看到的区域. 我正在通过react-native-maps https://github.com/react使用Google Maps -community/react-native-maps

Is there a way to limit the map to a specific area so that panning and zooming is contained inside that area and everything outside is locked away? I would like to limit what area the user can see on the map. I am using Google Maps via react-native-maps https://github.com/react-community/react-native-maps

这是我的代码，目前对可以缩放多远或可以向任意一侧平移多少没有限制

and this is my code and currently there is no limit on how far out you can zoom or how much you can pan to either side

    <View style={styles.container}>
        <MapView style={styles.map}
          provider= { PROVIDER_GOOGLE }
          customMapStyle={mapStyle}
          initialRegion={{
            latitude: 59.2937025,
            longitude: 18.0813377,
            latitudeDelta: 0.012,
            longitudeDelta: 0.012,

          }}
        />
    </View> 

推荐答案

TyBourque提交的解决方案有效. 稍微复杂一点的辅助工具，您可以使用maxZoomLevel道具来限制缩放.然后，您将需要使用onPanDrag事件，并需要检查{坐标:LatLng，位置:Point}是否在范围内，如果不在范围内，请将其重置为先前的有效位置.

The solution TyBourque submitted worked. A bit more of a complicated anwser, you can use the maxZoomLevel prop to limit the zoom. Then you will need to use the event onPanDrag and need to check if the { coordinate: LatLng, position: Point } is within the bounds and if it is not within the bounds reset it to the previous valid location.

这篇关于React-native-maps限制平移区域的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！