From 25b1646a2dd4445565a90289e9b4c750c1becd0d Mon Sep 17 00:00:00 2001 From: Michael Diego <6419886+itsmichaeldiego@users.noreply.github.com> Date: Tue, 1 Sep 2020 05:17:53 +0200 Subject: [PATCH] Reverts PR #921 to fix #931 (#933) * Revert "Fix heatmapLibrary" This reverts commit 8e67c08c275ea611e1a8d193c6888a312b47cafb. * Revert "Update API.md" This reverts commit 2d55cedfdd67b5410261f677f17c2d0969485757. * Revert "Added all google maps api libraries to api loader (#921)" This reverts commit 1718a4a9415e1422752f3ae68c8b7119af6ca8db. --- API.md | 39 ++++++++------------------------ CHANGELOG.md | 2 +- src/loaders/google_map_loader.js | 22 +----------------- 3 files changed, 12 insertions(+), 51 deletions(-) diff --git a/API.md b/API.md index 70410e4..7547b6e 100644 --- a/API.md +++ b/API.md @@ -16,7 +16,6 @@ Example: key: API_KEY, language: 'ru', region: 'ru', - libraries:['places'], ...otherUrlParams, }} > @@ -351,7 +350,7 @@ For more details see the [google documentation](https://developers.google.com/ma ### Heatmap Layer -To use the heatmap layer, add `visualization` to the libraries property array on `bootstrapURLKeys` and provide the data & configuration for the heatmap in `heatmap` as props. +To use the heatmap layer, add `heatmapLibrary={true}` to add the visualizations library, and provide the data&configuration for the heatmap in `heatmap` as props. The typescript interface for the heatmap prop is as follows: ```typescript @@ -373,38 +372,20 @@ interface heatmapProp { ```javascript - {markers} - + bootstrapURLKeys={{ key: [YOUR_KEY] }} + zoom={zoom} + center={center} + heatmapLibrary={true} + heatmap={{data}} + > + {markers} + ``` #### Important Note -If you have multiple `GoogleMapReact` components in project and you want to use heatmap layer provide `libraries:['visualization']` to `bootstrapURLKeys` so that the visualization library will be loaded with the google map api. +If you have multiple `GoogleMapReact` components in project and you want to use heatmap layer so provide `heatmapLibrary={true}` for all `GoogleMapReact` components so component will load heatmap library at the beginning with google map api. ### Localizing the Map This is done by setting bootstrapURLKeys.[language](https://developers.google.com/maps/documentation/javascript/localization#Language) and bootstrapURLKeys.[region](https://developers.google.com/maps/documentation/javascript/localization#Region). Also notice that setting region to 'cn' is required when using the map from within China, see [google documentation](https://developers.google.com/maps/documentation/javascript/localization#GoogleMapsChina) for more info. Setting 'cn' will result in use of the specific API URL for China. - - -### Libraries - -If you want to include additional libraries to load with the maps api, indicate them in the libraries property of the `bootstrapURLKeys` object. - -Example: -```JSX - -``` diff --git a/CHANGELOG.md b/CHANGELOG.md index c438289..b3edfd9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,7 +1,7 @@ ## [2.1.0] - 2020-08-31 - #921 Add support to libraries: places, visualization, places, and geomerty. -And keeps support for previous heatmapLibrary prop to avoid breaking older usage. +And keeps support for previous heatMapLibrary prop to avoid breaking older usage. ## [2.0.4] - 2020-07-30 diff --git a/src/loaders/google_map_loader.js b/src/loaders/google_map_loader.js index e0158af..f718346 100644 --- a/src/loaders/google_map_loader.js +++ b/src/loaders/google_map_loader.js @@ -58,32 +58,12 @@ export default (bootstrapURLKeys, heatmapLibrary) => { } } - // Support for older version using heatmapLibrary option - if (heatmapLibrary) { - bootstrapURLKeys.libraries - ? bootstrapURLKeys.libraries.append('visualization') - : (bootstrapURLKeys.libraries = ['visualization']); - console.warn( - "heatmapLibrary will be deprecated in the future. Please use bootstrapURLKeys.libraries property instead (libraries=['visualization'])." - ); - } - - // clean unknown and remove duplicates - const googleMapsLibs = ['places', 'drawing', 'geometry', 'visualization']; - if (bootstrapURLKeys.libraries) { - bootstrapURLKeys.libraries = bootstrapURLKeys.libraries.filter( - (lib, i) => - bootstrapURLKeys.libraries.indexOf(lib) === i && - googleMapsLibs.includes(lib) - ); - } - const params = Object.keys(bootstrapURLKeys).reduce( (r, key) => `${r}&${key}=${bootstrapURLKeys[key]}`, '' ); - const { libraries } = bootstrapURLKeys; + const libraries = heatmapLibrary ? '&libraries=visualization' : ''; $script_( `${DEFAULT_URL}${API_PATH}${params}${libraries}`,