Android : Error while updating property 'region' of a view managed by : AIRMap

[ghamaide]

While everything works fine on iOS, I get this error when running on Android :

My MapView component :

<MapView
            ref='map view'
            rotateEnabled={false}
            style={styles.restaurantsMap}
            showsUserLocation={this.state.showsUserLocation}
            region={this.state.region}
            onRegionChangeComplete={this.onRegionChangeComplete}
            onRegionChange={this.onRegionChange}>
            <MapView.Circle
              center={center}
              radius={this.state.radius}
              fillColor='rgba(0, 0, 0, 0.1)'
              strokeColor='#FE3139' />
          </MapView>

[DennisMG]

I was having the same issue! Debbuging the component I realized that region needs latitudDelta and longitudDelta. Once you add those props everything will work just fine.. At least that worked for me.

[Pocket-titan]

I had this issue too, and doing what @DennisMG did resolved the issue.
Tip: Use the Chrome debugging. It will provide you with a very clear error, in this case, it would've told you that region needs latitudeDelta and longitudeDelta as arguments as well.

[lucasfeliciano]

I'm having the same issue, I added the deltas coordinates but I still get this error:

            <MapView
              region={{
                latitude: 52.3015493,
                longitude: 4.6939769,
                latitudeDelta: 3,
                longitudeDelta: 4,
              }}
              style={styles.map}
              showsUserLocation
              zoomEnabled={false}
              scrollEnabled={false}
              rotateEnabled={false}
            >
              <MapView.Marker
                coordinate={{latitude:52.3015493,
                  longitude:4.6939769}} />
            </MapView>

[lucasfeliciano]

Ok, I figured it out what was my problem in this case:

If you use showsUserLocation props you need to add the ACCESS_FINE_LOCATION permission into your AndroidManifest.xml. Which make sense 😜

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>

That worked for me

[jrichardlai]

@ghamaide are you still getting the error?

[jrichardlai]

Closing this for now, please reopen if that's still an issue

[lavarajallu]

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>

Mr@lucasfeliciano , already i added in AndroidManifest.xml still getting this getting error.

[tenhsor1]

In my case, my issue was that the latitude and longitude props passed to MapView were typeof string. Fixed doing a parseFloat before.

[chapeljuice]

Thanks @tenhsor1 that was my issue too!

[aesthytik]

In my case, my issue was that the latitude and longitude props passed to MapView were typeof string. Fixed doing a parseFloat before.

you are a life savior !!!!!! @tenhsor1

[cwilby]

In my case latitude and longitude were missing from camera.center:

<MapView
  ...
  camera={{
    center: {
      latitude: parseFloat(latitude),
      longitude: parseFloat(longitude),
    },
    ...
  }}>

[witodivaro]

In my case it was a typo:

I used longTitude instead of longitude

[JDPrabasha]

While everything works fine on iOS, I get this error when running on Android :

I had the same error using yarn add react-native-maps to display a MapView component

Using expo install react-native-maps fixed things!

[mohitm15]

I am creating an app with expo where I require map. I explored and found the mapView component in react-native-maps npm package. I installed it and just added the below code in a new component from their documentation only see. But it is showing the same error:

import React, { useState } from "react";
import {  StyleSheet,  Text,  View} from "react-native";
import MapView from "react-native-maps";

const Map = () => {

  return (

    <View style={styles.container}>
        <Text style={styles.text}>
            Maps
        </Text>
        <MapView
           initialRegion={{
           latitude: 37.78825,
           longitude: -122.4324,
           latitudeDelta: 0.0922,
           longitudeDelta: 0.0421,
        }}
       />
      </View>   
  )
}

const styles = StyleSheet.create({
    container: {
        flex:1,
        justifyContent:'center',
        alignItems:'center'
    },
    text:{
        fontSize:40,
        margin:40,
    }
})
export default Map;

And I still found this error

How to solve this?

[diassis-paiva]

Uma solução que achei foi substituir initialRegion por initialCamera desta forma:

      <MapView
        initialCamera={{
          center: { latitude: -4.143009,  longitude: -40.582803 },
          pitch: 0,
          zoom: 18,
          heading: 0,
          altitude: 1000,
        }}
        provider={PROVIDER_GOOGLE}
      >

[VashRogers]

Uma solução que achei foi substituir initialRegion por initialCamera desta forma:

      <MapView
        initialCamera={{
          center: { latitude: -4.143009,  longitude: -40.582803 },
          pitch: 0,
          zoom: 18,
          heading: 0,
          altitude: 1000,
        }}
        provider={PROVIDER_GOOGLE}
      >

The solution I found for this error was to use a previous version of react native maps, using the command expo doctor --fix-dependencies

[adribalbvena]

Same problem here, but i realized the warning: "Some dependencies are incompatible with the installed expo package version: react-native-maps - expected version: 0.30.2 - actual version installed: 0.31.1"

• So.. I've run:
  expo doctor --fix-dependencies
  et voilá!

[amiravisar89]

While everything works fine on iOS, I get this error when running on Android :

I had the same error using yarn add react-native-maps to display a MapView component

Using expo install react-native-maps fixed things!

you have saved my day

[suyashvash]

I'm having the same issue, I added the deltas coordinates but I still get this error:

            <MapView
              region={{
                latitude: 52.3015493,
                longitude: 4.6939769,
                latitudeDelta: 3,
                longitudeDelta: 4,
              }}
              style={styles.map}
              showsUserLocation
              zoomEnabled={false}
              scrollEnabled={false}
              rotateEnabled={false}
            >
              <MapView.Marker
                coordinate={{latitude:52.3015493,
                  longitude:4.6939769}} />
            </MapView>

Worked for me, Thanks

[adithkrishnan98]

While everything works fine on iOS, I get this error when running on Android :

I had the same error using yarn add react-native-maps to display a MapView component

Using expo install react-native-maps fixed things!

This fixed it for me! Thanks a lot!

[aathi271991]

While everything works fine on iOS, I get this error when running on Android previous it working but now not working

[DevangMstryls]

While everything works fine on iOS, I get this error when running on Android previous it working but now not working

I'm having the same issue.

[Saichand13]

@DevangMstryls Did you find the solution for this issue ?

[logan0900]

@Saichand13 @DevangMstryls guys we are rocking on the same boat, coz I got the same error while using the "map Polyline" if you find any solution then share it. 💯

[Saichand13]

@logan0900 found a temporary fix change googlePlayServicesVersion = "+" to googlePlayServicesVersion = "17.0.0" in android/build.gradle.
Working for me

[logan0900]

@Saichand13 Android works fine for me, I got an error in IOS.
here it is.

[Rana-Usama]

expo install react-native-maps

Running this command fixed it for me as well!
Cheers.

[batazo]

I got this error in EXPO SDK 48 v1.3.1