Merge commit v0.26.1 into eres

* commit '3ae31e4a336102538ee422a0d4e71a2ea32647bb': (24 commits) [0.26.1] Release rn 0.60.5 support (react-native-maps#3020) "AIRMap" was not found in the UIManager IN "0.26.0" (react-native-maps#3103) [0.26.0] Release Add Heatmap back in (react-native-maps#3064) Fixes NPE while removing already removed marker. (react-native-maps#3032) Add flat property binding on Marker for iOS (react-native-maps#3051) Add heading to the onUserLocationChange listener (react-native-maps#3045) Add onDoublePress callback (react-native-maps#2937) Allow using onPanDrag while scrollEnabled=true (react-native-maps#2935) updating pods for compile error (react-native-maps#3011) add overlay onPress event (react-native-maps#3007) Fix playServicesVersion name in installation docs (react-native-maps#3016) Update index.d.ts (react-native-maps#2887) Add @ReactModule annotation to help turbomodules processor (react-native-maps#3001) Google Maps - Heatmaps for Android and iOS (react-native-maps#2960) Added GeoJSON support by default (react-native-maps#2959) Update GoogleMaps pos to 3.2.0 (react-native-maps#2999) convert to new react native config format (RN 0.60 (react-native-maps#2975) fix select annotation when show/hide callout view (react-native-maps#2973) ... # Conflicts: # package.json
netmaxt3r · Oct 6, 2019 · 2e9fbcd · 2e9fbcd
2 parents e0cd12b + 3ae31e4
commit 2e9fbcd
Show file tree

Hide file tree

Showing 47 changed files with 1,448 additions and 84 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,4 +1,22 @@
 # Change Log
+## 0.26.1 (October 3, 2019)
+
+* Android: [#3103](https://github.com/react-native-community/react-native-maps/pull/3103) Support for RN 0.60.5
+* Android: [#3103](https://github.com/react-native-community/react-native-maps/pull/3103) "AIRMap" was not found in the UIManager
+
+## 0.26.0 (September 30, 2019)
+
+* iOS: [#2999](https://github.com/react-native-community/react-native-maps/pull/2999) Update GoogleMaps pod to 3.2.0 
+* iOS: [#2395](https://github.com/react-native-community/react-native-maps/pull/2395) Allow using onPanDrag while scrollEnabled=true
+* iOS: [#3051](https://github.com/react-native-community/react-native-maps/pull/3051) Add flat property binding on Marker for iOS
+* Android: [#3007](https://github.com/react-native-community/react-native-maps/pull/3007) Add Overlay onPress event
+* Android: [#3001](https://github.com/react-native-community/react-native-maps/pull/3001) Add @ReactModule annotation to help turbo modules processor
+* Common: [#3045](https://github.com/react-native-community/react-native-maps/pull/3045) Add heading to the onUserLocationChange listener
+* Common: [#2937](https://github.com/react-native-community/react-native-maps/pull/2937) Add onDoublePress callback
+* Common: [#2960](https://github.com/react-native-community/react-native-maps/pull/2959) Heatmaps for Android and iOS
+* Common: [#2959](https://github.com/react-native-community/react-native-maps/pull/2959) Added GeoJSON support by default 
+* Common: [#2975](https://github.com/react-native-community/react-native-maps/pull/2975) Convert to new react native config format (RN 0.60)
+* Common: [#2973](https://github.com/react-native-community/react-native-maps/pull/2973) Fix select annotation when show/hide callout view
 
 ## 0.25.0 (July 11, 2019)
 * Android: [#2941](https://github.com/react-native-community/react-native-maps/pull/2941) Fix build gradle to allow jettifier to run correctly

diff --git a/README.md b/README.md
@@ -38,6 +38,10 @@ versions you should add `react` as a dependency in your `package.json`.
 
 [`<Overlay />` Component API](docs/overlay.md)
 
+[`<Heatmap />` Component API](docs/heatmap.md)
+
+[`<Geojson />` Component API](docs/geojson.md)
+
 ## General Usage
 
 ```js

diff --git a/docs/geojson.md b/docs/geojson.md
@@ -0,0 +1,36 @@
+# `<Geojson />` Component API
+
+## Props
+
+| Prop      | Type | Default                                                | Note |
+| --------- | ---- | ------------------------------------------------------ | ---- |
+| `geojson` |      | [Geojson](https://geojson.org/) description of object. |
+
+## Example
+
+```
+import React from 'react';
+import MapView, {Geojson} from 'react-native-maps';
+
+const myPlace = {
+  type: 'FeatureCollection',
+  features: [
+    {
+      type: 'Feature',
+      properties: {},
+      geometry: {
+        type: 'Point',
+        coordinates: [64.165329, 48.844287],
+      }
+    }
+  ]
+};
+
+const Map = props => (
+  <MapView>
+    <Geojson geojson={myPlace} />
+  </MapView>
+);
+```
+
+
diff --git a/docs/heatmap.md b/docs/heatmap.md
@@ -0,0 +1,32 @@
+# `<Heatmap />` Component API
+
+## Props
+
+| Prop | Type | Default | Note |
+|---|---|---|---|
+| `points` | `Array<WeightedLatLng>` |  | Array of heatmap entries to apply towards density.
+| `radius` | `Number` | `20` | The radius of the heatmap points in pixels, between 10 and 50.
+| `opacity` | `Number` | `0.7` | The opacity of the heatmap.
+| `gradient` | `Object` |  | Heatmap gradient configuration (See below for *Gradient Config*).
+
+
+## Gradient Config
+
+[Android Doc](https://developers.google.com/maps/documentation/android-sdk/utility/heatmap#custom) | [iOS Doc](https://developers.google.com/maps/documentation/ios-sdk/utility/heatmap#customize)
+
+| Prop | Type | Default | Note |
+|---|---|---|---|
+| `colors` | `Array<String>` |  | Colors (one or more) to use for gradient.
+| `startPoints` | `Array<Number>` |  | Array of floating point values from 0 to 1 representing where each color starts. Array length must be equal to `colors` array length.
+| `colorMapSize` | `Number` | `256` | Resolution of color map -- number corresponding to the number of steps colors are interpolated into.
+
+
+## Types
+
+```
+type WeightedLatLng = {
+  latitude: Number;
+  longitude: Number;
+  weight?: Number;
+}
+```
diff --git a/docs/installation.md b/docs/installation.md
@@ -3,39 +3,46 @@
 Install the library from npm:
 
 ```sh
-npm install react-native-maps --save
+npm install react-native-maps --save-exact
+yarn add react-native-maps -E
 ```
 
 The library ships with platform native code that needs to be compiled
 together with React Native. This requires you to configure your build
 tools.
 
+Since React Native 0.60 and higher, [autolinking](https://github.com/react-native-community/cli/blob/master/docs/autolinking.md) makes the installation process simpler.
+
 The actual map implementation depends on the platform. On Android, one
 has to use [Google
 Maps](https://developers.google.com/maps/documentation/), which in turn
-requires you to obtain an API key for the [Android
+requires you to obtain an [API key for the Android
 SDK](https://developers.google.com/maps/documentation/android-sdk/signup).
 
 On iOS, one can choose between Google Maps or the native [Apple
 Maps](https://developer.apple.com/documentation/mapkit/) implementation. 
 
-When using Google Maps on iOS, you need to also register for the [iOS
+When using Google Maps on iOS, you need also to obtain an [API key for the iOS
 SDK](https://developers.google.com/maps/documentation/ios-sdk/get-api-key)
 and include the Google Maps library in your build. The native Apple Maps
 based implementation works out-of-the-box and is therefore simpler to
 use at the price of missing some of the features supported by the Google
 Maps backend.
 
+> **WARNING**: Before you can start using the Google Maps Platform APIs and SDKs, you must sign up and create a [billing account](https://developers.google.com/maps/gmp-get-started#create-billing-account)!
+
+---
+
 ## Build configuration on iOS
 
-### Using React Native Link
+### Using React Native Link (React Native 0.59 and lower)
 
 Run `react-native link react-native-maps` after which you should be able
 to use this library on iOS. Note that by default this will use Apple
 Maps and you will miss some of the features provided by Google (see the
 instruction on manually enabling Google Maps below).
 
-### Using CocoaPods
+### Using CocoaPods (React Native 0.59 and lower)
 
 > If the CocoaPods package manager is new to you, please first review
 > its [installation guide](https://guides.cocoapods.org/using/getting-started.html)
@@ -108,7 +115,14 @@ pod install
 
 and open the produced workspace file (`.xcworkspace`) in XCode to build your project.
 
-### Enabling Google Maps on iOS
+### Using CocoaPods (React Native 0.60 and higher)
+
+```sh
+cd ios
+pod install
+```
+
+### Enabling Google Maps on iOS (React Native all versions)
 
 If you want to enable Google Maps on iOS, obtain the Google API key and
 edit your `AppDelegate.m` as follows:
@@ -127,57 +141,58 @@ edit your `AppDelegate.m` as follows:
 
 The `[GMSServices provideAPIKey]` should be the **first call** of the method.
 
-Then, do either of the following
+Then, do either of the following:
 
-1. If you are using CocoaPods to manage your dependecies, uncomment the
+a) (React Native 0.59 and lower) If you are using CocoaPods to manage your dependecies, uncomment the
 lines related to Google Maps from the `Podfile` and run `pod install`.
 
-2. If you used React Native link, you may include Google Maps manually as a
+b) (React Native 0.59 and lower) If you used React Native link, you may include Google Maps manually as a
 XCode framework following the instructions from [SDK docs -> Install
 manually](https://developers.google.com/maps/documentation/ios-sdk/start). Then, to link this library to the framework, add the following to your
 `package.json` and replace the
 `REPLACE_ME_RELATIVE_PATH_TO_GOOGLE_MAPS_INSTALL` with the relative path
 from your project root to the directory in which you installed the
 Google Maps frameworks. You might need to specify a recursive search path 
-by adding a `/**` at the end of the provided path (e.g. `"./node_modules/react-native-maps/enable-google-maps 'ios/my-frameworks/GoogleMaps/**'"
-
-    ```json
-    {
-      "name": "your-app",
-      "scripts": {
-        "postinstall": "./node_modules/react-native-maps/enable-google-maps REPLACE_ME_RELATIVE_PATH_TO_GOOGLE_MAPS_INSTALL"
-      }
-    }
-    ```
-
-    Re-run `npm install` or `yarn` to ensure the `postinstall` script is run.
-
-3. Import and add `{PROVIDER_GOOGLE}` to your JavaScript:
-    ```javascript
-      import MapView, { PROVIDER_GOOGLE } from 'react-native-maps';
-      ...
-
-      <MapView
-         provider={PROVIDER_GOOGLE}
-         style={styles.map}
-         ...
-      >
-
-    ```
+by adding a `/**` at the end of the provided path (e.g. "./node_modules/react-native-maps/enable-google-maps 'ios/my-frameworks/GoogleMaps/**'"
+
+```json
+{
+  "name": "your-app",
+  "scripts": {
+    "postinstall": "./node_modules/react-native-maps/enable-google-maps REPLACE_ME_RELATIVE_PATH_TO_GOOGLE_MAPS_INSTALL"
+  }
+}
+```
+
+Re-run `npm install` or `yarn` to ensure the `postinstall` script is run.
+
+c) (React Native 0.60 and higher) Add the following to your Podfile above the `use_native_modules!` function and run `pod install` in the ios folder:
+  ```ruby
+    # React Native Maps dependencies
+    rn_maps_path = '../node_modules/react-native-maps'
+    pod 'react-native-google-maps', :path => rn_maps_path
+    pod 'GoogleMaps'
+    pod 'Google-Maps-iOS-Utils'
+  ```
+
+That's it, you made it! 👍
+    
+---
+
 
 ## Build configuration on Android
 
 Ensure your build files match the following requirements:
 
-1. Define the `react-native-maps` project in `android/settings.gradle`:
+1. (React Native 0.59 and lower) Define the `react-native-maps` project in `android/settings.gradle`:
 
 ```groovy
 ...
 include ':react-native-maps'
 project(':react-native-maps').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-maps/lib/android')
 ```
 
-2. Add the `react-native-maps` as an dependency of your app in `android/app/build.gradle`:
+2. (React Native 0.59 and lower) Add the `react-native-maps` as an dependency of your app in `android/app/build.gradle`:
 
 ```groovy
 ...
@@ -187,7 +202,7 @@ dependencies {
 }
 ```
 
-If you've defined *[project-wide
+3.1 (React Native all versions) If you've defined *[project-wide
 properties](https://developer.android.com/studio/build/gradle-tips.html)*
 (**recommended**) in your root `build.gradle`, this library will detect
 the presence of the following properties:
@@ -200,16 +215,32 @@ allprojects {...}
  + Project-wide Gradle configuration properties
  */
 ext {
-    compileSdkVersion   = 26
-    targetSdkVersion    = 26
-    buildToolsVersion   = "26.0.2"
-    supportLibVersion   = "26.1.0"
-    googlePlayServicesVersion = "16.1.0" // or set latest version
-    androidMapsUtilsVersion = "0.5+"
+    compileSdkVersion   = xxx
+    targetSdkVersion    = xxx
+    buildToolsVersion   = "xxx"
+    minSdkVersion       = xxx
+    supportLibVersion   = "xxx"
+    playServicesVersion = "xxx" // or set latest version
+    androidMapsUtilsVersion = "xxx"
+}
+```
+or do
+```
+buildscript {
+    ext {
+        buildToolsVersion = "xxx"
+        minSdkVersion = xxx
+        compileSdkVersion = xxx
+        targetSdkVersion = xxx
+        supportLibVersion = "xxx"
+        playServicesVersion = "xxx" // or set latest version
+        androidMapsUtilsVersion = "xxx"
+    }
 }
+...
 ```
 
-If you do **not** have *project-wide properties* defined and have a
+3.2 (React Native all versions) If you do **not** have *project-wide properties* defined and have a
 different play-services version than the one included in this library,
 use the following instead (switch 10.0.1 for the desired version):
 
@@ -226,7 +257,7 @@ dependencies {
 }
 ```
 
-3. Specify your Google Maps API Key:
+4. (React Native all versions) Specify your Google Maps API Key:
 
    Add your API key to your manifest file (`android/app/src/main/AndroidManifest.xml`):
 
@@ -250,7 +281,7 @@ dependencies {
 
 Source: https://developers.google.com/maps/documentation/android-api/signup
 
-4. Add `import com.airbnb.android.react.maps.MapsPackage;` and `new MapsPackage()` in your `MainApplication.java` :
+5. (React Native 0.59 and lower) Add `import com.airbnb.android.react.maps.MapsPackage;` and `new MapsPackage()` in your `MainApplication.java` :
 
 ```java
 import com.airbnb.android.react.maps.MapsPackage;
@@ -264,14 +295,18 @@ import com.airbnb.android.react.maps.MapsPackage;
     }
 ```
 
-5. Ensure that you have Google Play Services installed:
+6. (React Native all versions) Ensure that you have Google Play Services installed:
 
   * For the Genymotion emulator, you can follow [these instructions](https://www.genymotion.com/help/desktop/faq/#google-play-services).
   * For a physical device you need to search on Google for 'Google Play
     Services'. There will be a link that takes you to the Play Store and
     from there you will see a button to update it (do not search within the
     Play Store).
 
+That's it, you made it! :+1:
+
+---
+
 ## Troubleshooting
 
 ### The map background is blank (Google Maps)

diff --git a/docs/mapview.md b/docs/mapview.md
@@ -56,6 +56,7 @@ To access event data, you will need to use `e.nativeEvent`. For example, `onPres
 | `onRegionChangeComplete` | `Region` | Callback that is called once when the region changes, such as when the user is done moving the map.
 | `onUserLocationChange` | `{ coordinate: Location }` | Callback that is called when the underlying map figures our users current location (coordinate also includes isFromMockProvider value for Android API 18 and above). Make sure **showsUserLocation** is set to *true* and that the provider is `"google"`.
 | `onPress` | `{ coordinate: LatLng, position: Point }` | Callback that is called when user taps on the map.
+| `onDoublePress` | `{ coordinate: LatLng, position: Point }` | Callback that is called when user double taps on the map.
 | `onPanDrag` | `{ coordinate: LatLng, position: Point }` | Callback that is called when user presses and drags the map. **NOTE**: for iOS `scrollEnabled` should be set to false to trigger the event
 | `onPoiClick` | `{ coordinate: LatLng, position: Point, placeId: string, name: string }` | Callback that is called when user click on a POI.
 | `onLongPress` | `{ coordinate: LatLng, position: Point }` | Callback that is called when user makes a "long press" somewhere on the map.

diff --git a/docs/overlay.md b/docs/overlay.md
@@ -6,6 +6,13 @@
 |---|---|---|---|
 | `image` | `ImageSource` | A custom image to be used as the overlay. Only required local image resources and uri (as for images located in the net) are allowed to be used.
 | `bounds` | `Array<LatLng>` |  | The coordinates for the image (left-top corner, right-bottom corner). ie.```[[lat, long], [lat, long]]```
+| `tappable` | `Bool` | `false` | `Android only` Boolean to allow an overlay to be tappable and use the onPress function.
+
+## Events
+
+| Event Name | Returns | Notes
+|---|---|---|
+| `onPress` |  | `Android only` Callback that is called when the user presses on the overlay
 
 ## Types
 

diff --git a/example/App.js b/example/App.js
@@ -48,6 +48,7 @@ import TestIdMarkers from './examples/TestIdMarkers';
 import IndoorMap from './examples/IndoorMap';
 import CameraControl from './examples/CameraControl';
 import MassiveCustomMarkers from './examples/MassiveCustomMarkers';
+import GeojsonMap from './examples/Geojson';
 
 const IOS = Platform.OS === 'ios';
 const ANDROID = Platform.OS === 'android';
@@ -177,6 +178,7 @@ export default class App extends React.Component<Props> {
         [IndoorMap, 'Indoor Map', true],
         [CameraControl, 'CameraControl', true],
         [MassiveCustomMarkers, 'MassiveCustomMarkers', true],
+        [GeojsonMap, 'Geojson', true],
       ]
         // Filter out examples that are not yet supported for Google Maps on iOS.
         .filter(