CODEWITHSUNDEEP
javascriptreactjsreact-nativereact-native-maps
aName
aName

Reputation: 3063

how to get zoom level in react native map

I'm trying to calculate the zoom level when user zoom in or out,
I find that react native maps has a onRegionChange which has longiture, latitude, longitude delta and latitude delta which (I guess) could be used to compute zoom level
from this response I tried this way: 

 Math.round(Math.log(360 / this.state.longitudeDelta) / Math.LN2);

but it return a big number (which is not the zoom level).

Upvotes: 2

Views: 8087

Answers (3)

Furkan Guler
Furkan Guler

Reputation: 56

     <MapView
          onRegionChangeComplete={async (region) => {
            const coords = await ref?.current?.getCamera();
            console.log('coords', coords.zoom);
          }}
          ref={ref} />

Upvotes: 2

FortuneCookie
FortuneCookie

Reputation: 1865

Write a function like below in the onRegionChangeComplete prop of react-native-map

changeRegion = debounce(async region => {
    console.log(
    Math.log2(360 * (metrics.screenWidth / 256 / region.longitudeDelta)) + 1
    );
  }, 1000);

or to be specific , Math.log2(360 * (metrics.screenWidth / 256 / region.longitudeDelta)) + 1); does the magic.

Upvotes: 7

Nooruddin Lakhani
Nooruddin Lakhani

Reputation: 6967

log2(360 * ((screenWidth/256) / region.longitudeDelta)) + 1

Upvotes: 0

Related Questions