Back to Browse

How to Use Google Maps in React Native - Part 1

91.0K views
Oct 26, 2019
26:18

This is part 1 of 2 part set to show how to use Google maps in React Native for both Android and iOS. This video focuses on the basics of the MapView, Marker, Callout, Polygon, and Circle components. Part 2 will cover more in depth use cases and UI 00:00 - Intro 00:48 - Setup overview and documentation 08:16 - Adding the MapView component 11:38 - Adding the first marker 13:28 - Creating a custom callout for the marker 15:21 - Using an image in the marker icon 16:28 - Creating a polygon from an array of coords 19:30 - Creating a colored circle from an array of coords 21:00 - Handling the onPress event of a callout 22:46 - Displaying multiple markers Get the Code: https://github.com/theflutterfactory/React-Native-Tutorials/tree/react-native-maps_example ⚡Connect on Facebook: https://www.facebook.com/flutterfactory ⚡Connect on Twitter: https://twitter.com/flutterfactory

Download

1 formats

Video Formats

360pmp443.2 MB

Right-click 'Download' and select 'Save Link As' if the file opens in a new tab.

How to Use Google Maps in React Native - Part 1 | NatokHD