Home > Blockchain >  how to limit zoom on a map in react native with <MapView/> component
how to limit zoom on a map in react native with <MapView/> component

Time:02-26

<Map

          ref={mapRef}
          key={mapShouldUpdate}
          showsUserLocation
          userLocationAnnotationTitle={`Ma position`}
          showsMyLocationButton
          showsPointsOfInterest={false}
          showsBuildings={false}
          showsTraffic={false}
          showsIndoors={false}
          minZoomLevel={9}
          maxZoomLevel={12}
          rotateEnabled={false}
          pitchEnabled={false}
          toolbarEnabled={false}
          loadingEnabled={usersLoading || offersLoading}
          moveOnMarkerPress={false}
          mapType={getMapType()}
          initialRegion={{
            latitude: mapCenter?.latitude,
            longitude: mapCenter?.longitude,
            latitudeDelta: 0.4,
            longitudeDelta: 0.2,
          }}
          onRegionChangeComplete={(region) => {
            setMapCenter(region)
            onRegionChangeComplete?.(region)
          }}
          style={{ ...eva.style.Map, ...style }}
        >

I tried changing the minZoomLevel, maxZoomLevel, latitudeDelta, longitudeDelta but it doesn't render what I want. I would like the user zoom to be limited. Any solution?

CodePudding user response:

Could you try:

minDelta={0.05}
maxDelta={2}

it should work!

CodePudding user response:

https://github.com/react-native-maps/react-native-maps/blob/master/lib/components/MapView.js

Voici la solution (et les informations pour atteindre les 30 caractères)

  • Related