如何解决React-native-maps初始缩放:0不适用于iOS
我找不到让iOS RN地图从缩放级别0开始或缩小到0的方法。
const allowScaling = false;
const region = {
latitude: 0,longitude: 0,latitudeDelta: 170,longitudeDelta: 180,};
return (
<View
style={{
position: 'relative',width: '100%',height: '100%',overflow: 'hidden',}}
>
<MapView
ref={this.setRef}
onPress={this.onPress}
onLongPress={this.onLongPress}
style={{ width: '100%',height: '100%' }}
zoomControlEnabled
provider={Platform.OS === 'ios' ? 'google' : 'osmdroid'}
moveOnMarkerPress={false}
customMapStyle={[
{
stylers: [
{
visibility: 'off',},],]}
rotateEnabled={false}
scrollEnabled={allowScaling}
pitchEnabled={allowScaling}
zoomTapEnabled={allowScaling}
zoomEnabled={allowScaling}
cacheEnabled={false}
initialRegion={region}
onRegionChangeComplete={this.onRegionChange}
maxZoomLevel={Platform.OS === 'ios' ? maxZoom : Math.max(maxZoom,10)}
minZoomLevel={0}
>
<UrlTile
urlTemplate={`${url}/{z}/{x}/{y}/`}
maximumZ={maxZoom}
tileSize={256}
/>
{this.renderMarker()}
</MapView>
</View>
完全相同的代码以zoom开头:Android中为0(如附图所示)
我尝试将delta
设置maximumZ={0}
设置minZoomLevel
和maxZoomLevel
设置为0等。
对于iOS来说,将initialZoom设置为0似乎没有任何作用,甚至没有尝试如下缩小到0:
minZoomLevel={this.state.minZoomLevel}
onMapReady={()=>{
this.setState({
minZoomLevel: 8
})
}}
依赖项:
"react-native-maps-osmdroid": "^0.26.1-rc1","react-native": "0.62.2",
注意:在尝试使用谷歌地图类型之前,我尝试了苹果地图,问题也在那里。
解决方法
camera
设置控制缩放级别。如此处所述https://github.com/react-native-community/react-native-maps/blob/dbf746d66ca1b42f2beb790bfbf4c0e3a74f3279/docs/mapview.md
type Camera = {
center: {
latitude: number,longitude: number,},pitch: number,heading: number
// Only on iOS MapKit,in meters. The property is ignored by Google Maps.
altitude: number.
// Only when using Google Maps.
zoom: number
}
请注意,使用相机时,iOS和Google Maps上的MapKit有所不同 如何指定高度。对于跨平台应用程序,它是 必须分别指定缩放级别和高度。
可以在此处找到如何指定缩放级别的示例(https://github.com/react-native-community/react-native-maps/blob/master/example/examples/CameraControl.js)。参见下面来自同一示例的一些代码:
<MapView
provider={this.props.provider}
ref={ref => {
this.map = ref;
}}
style={styles.map}
initialCamera={{
center: {
latitude: LATITUDE,longitude: LONGITUDE,pitch: 45,heading: 90,altitude: 1000,zoom: 10,}}
/>
如上所述,对于Google地图,请使用zoom
道具来定义缩放级别。 minZoomLevel
和maxZoomLevel
控制最小值和最大值。
请注意,如果您还提供initialCamera
,则会忽略region
。确保提供其中一个。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。