React Native Maps Tutorial || Step-by-Step || Maps with React Native

[@ArjunYadav-np4fh]

Simply Excellent , I need more and more Videos on Google Map specially Geofencing Please

[@ArsilMalek-t3m]

I am getting Error=> Permission is NULL at 12:56

[@DigiPandaCompany]

you can open permission by hand onw self , i have also receved this error when i open location own phone then solved error

[@alphathe_wolf2819]

Bro can we use Direction API for showing route between two points in UI without having billing account in google console?

[@thedebugarena]

Nope those are paid API

[@saswatmishra-s4m]

my maps is loading with a grey background even after adding google_api.xml, any idea how to resolve?

[@thedebugarena]

Make sure to enable all the required api and also keep your location enable and then rebuild the app

[@developer-video]

please make video aws location services

[@nandk45523]

I got an error the screen where i used react native maps after built apk for react native map app closes when ever i open that screen.

[@thedebugarena]

What error u r getting

[@vidursharma8284]

Hello brother I have tried numerous times to make a build through react native community cli but the build is failing.I have tried numerous possible solutions.Can you help me somehow?

[@thedebugarena]

Yaa sure Please DM me on instagram

[@gopinathkrm58]

I have a case where user will enter address and need to convert that to coords and mark it in the map. How can this be implemented ? How to convert the user input to coords ?

[@thedebugarena]

Basically there is no need to do this. In order to fetch the address in google map you will have to buy google API key. If you do so it will provide much more better features then this. There you can directly search through address and it will give you distance.

[@gopinathkrm58]

@@thedebugarena No I don't need calculation of distance but there will be a input to enter location manually and when this happens I need to convert that given address and mark in the map

[@thedebugarena]

@@gopinathkrm58 yaa for that you will have to buy Google map api key

[@gopinathkrm58]

@@thedebugarena okay thank you, I saw another video of urs to get free api and that doesn't work?

[@thedebugarena]

@@gopinathkrm58 That works there are limited functionality you can get from there but not all

[@craavash7826]

Invariant Violation: requireNativeComponent: "AIRMap" was not found in the UIManager.
This error is located at:
in AIRMap (created by MapView)
in MapView (created by MapImplementation)
in RCTView (created by View)
in View (created by MapImplementation)
in MapImplementation (created by ExploreScreen)
in RCTView (created by View)
in View (created by ExploreScreen)
in ExploreScreen (created by SceneView)
in StaticContainer
in EnsureSingleNavigator (created by SceneView)
in SceneView (created by BottomTabView)
in RCTView (created by View)
in View (created by Screen)
in RCTView (created by View)
in View (created by Background)
in Background (created by Screen)
in Screen (created by BottomTabView)
in RNSScreen (created by Animated(Anonymous))
in Animated(Anonymous) (created by InnerScreen)
in Suspender (created by Freeze)
in Suspense (created by Freeze)
in Freeze (created by DelayedFreeze)
in DelayedFreeze (created by InnerScreen)
in InnerScreen (created by Screen)
in Screen (created by MaybeScreen)
in MaybeScreen (created by BottomTabView)
in RNSScreenContainer (created by ScreenContainer)
in ScreenContainer (created by MaybeScreenContainer)
in MaybeScreenContainer (created by BottomTabView)
in RCTView (created by View)
in View (created by SafeAreaProviderCompat)
in SafeAreaProviderCompat (created by BottomTabView)
in BottomTabView (created by BottomTabNavigator)
in PreventRemoveProvider (created by NavigationContent)
in NavigationContent
in Unknown (created by BottomTabNavigator)
in BottomTabNavigator (created by TabLayout)
in RCTView (created by View)
in View (created by TabLayout)
in TabLayout (created by IndexScreen)
in RCTView (created by View)
in View (created by IndexScreen)
in IndexScreen (created by SceneView)
in StaticContainer
in EnsureSingleNavigator (created by SceneView)
in SceneView (created by Drawer)
in RCTView (created by View)
in View (created by Screen)
in RCTView (created by View)
in View (created by Background)
in Background (created by Screen)
in Screen (created by Drawer)
in RNSScreen (created by Animated(Anonymous))
in Animated(Anonymous) (created by InnerScreen)
in Suspender (created by Freeze)
in Suspense (created by Freeze)
in Freeze (created by DelayedFreeze)
in DelayedFreeze (created by InnerScreen)
in InnerScreen (created by Screen)
in Screen (created by MaybeScreen)
in MaybeScreen (created by Drawer)
in RNSScreenContainer (created by ScreenContainer)
in ScreenContainer (created by MaybeScreenContainer)
in MaybeScreenContainer (created by Drawer)
in RCTView (created by View)
in View (created by Drawer)
in RCTView (created by View)
in View (created by AnimatedComponent(View))
in AnimatedComponent(View)
in Unknown (created by Drawer)
in RCTView (created by View)
in View (created by AnimatedComponent(View))
in AnimatedComponent(View)
in Unknown (created by PanGestureHandler)
in PanGestureHandler (created by PanGestureHandler)
in PanGestureHandler (created by Drawer)
in Drawer (created by DrawerViewBase)
in DrawerViewBase (created by DrawerView)
in RNGestureHandlerRootView (created by GestureHandlerRootView)
in GestureHandlerRootView (created by DrawerView)
in RCTView (created by View)
in View (created by SafeAreaProviderCompat)
in SafeAreaProviderCompat (created by DrawerView)
in DrawerView (created by DrawerNavigator)
in PreventRemoveProvider (created by NavigationContent)
in NavigationContent
in Unknown (created by DrawerNavigator)
in DrawerNavigator (created by DrawerNavigation)
in DrawerNavigation (created by SceneView)
in StaticContainer
in EnsureSingleNavigator (created by SceneView)
in SceneView (created by SceneView)
in RCTView (created by View)
in View (created by DebugContainer)
in DebugContainer (created by MaybeNestedStack)
in MaybeNestedStack (created by SceneView)
in RCTView (created by View)
in View (created by SceneView)
in RNSScreen (created by Animated(Anonymous))
in Animated(Anonymous) (created by InnerScreen)
in Suspender (created by Freeze)
in Suspense (created by Freeze)
in Freeze (created by DelayedFreeze)
in DelayedFreeze (created by InnerScreen)
in InnerScreen (created by Screen)
in Screen (created by SceneView)
in SceneView (created by NativeStackViewInner)
in Suspender (created by Freeze)
in Suspense (created by Freeze)
in Freeze (created by DelayedFreeze)
in DelayedFreeze (created by ScreenStack)
in RNSScreenStack (created by ScreenStack)
in ScreenStack (created by NativeStackViewInner)
in NativeStackViewInner (created by NativeStackView)
in RNCSafeAreaProvider (created by SafeAreaProvider)
in SafeAreaProvider (created by SafeAreaProviderCompat)
in SafeAreaProviderCompat (created by NativeStackView)
in NativeStackView (created by NativeStackNavigator)
in PreventRemoveProvider (created by NavigationContent)
in NavigationContent
in Unknown (created by NativeStackNavigator)
in NativeStackNavigator (created by App)
in EnsureSingleNavigator
in BaseNavigationContainer
in ThemeProvider
in NavigationContainerInner (created by App)
in RNGestureHandlerRootView (created by GestureHandlerRootView)
in GestureHandlerRootView (created by App)
in UserProvider (created by App)
in App (created by withDevTools(App))
in withDevTools(App)
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
in AppContainer
in main(RootComponent), js engine: hermes
Help someone

[@thedebugarena]

Are u able to solve this?

[@ezeanichucks3728]

Let me guess. You're using expo?
If yes, expo doesn't come with some native modules which external libraries like Google map need to run.
You must convert your expo to raw react native

[@JoshBleijenberg]

I only see a gray background with the google logo, only on android. How do we fix this

[@thedebugarena]

Make sure to enable all the required api also enable your location and rebuild

[@JoshBleijenberg]

@@thedebugarena Thanks you for your reaction. API is enabled, but we don t need the current location of the user, we just want to display some locations. Do we still need to enable the location?

[@thedebugarena]

@@JoshBleijenberg try that but make sure your location is enabled and also app hi having all the permission

[@wasanthakumara2356]

why display this error ( "AIRMap" was not found in the UIManager ). how to fixed this

[@thedebugarena]

Try Re-Installing package with yarn

[@wasanthakumara2356]

​@@thedebugarenaI try it but it not fix

[@thedebugarena]

@@wasanthakumara2356 if possible try creating new project and if the issue is same try by downgrading react native maps version.

[@wasanthakumara2356]

​@@thedebugarena what is you use map version & react native version.

[@muhammadfaridgul137]

Sir my map on android phone is not loading

[@thedebugarena]

Make sure you have enabled all the required apis in Google cloud platform

[@sherimehar1762]

informative video

[@prasadgawade9514]

Is react native maps required api key in production?

[@thedebugarena]

Yup