mirror of
https://github.com/google-map-react/google-map-react.git
synced 2025-12-08 18:26:32 +00:00
* 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.
This commit is contained in:
parent
9e06d200b1
commit
25b1646a2d
39
API.md
39
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
|
||||
<GoogleMapReact
|
||||
bootstrapURLKeys={{
|
||||
key: [YOUR_KEY],
|
||||
libraries:['visualization']
|
||||
}}
|
||||
zoom={zoom}
|
||||
center={center}
|
||||
heatmap={{data}}
|
||||
>
|
||||
{markers}
|
||||
</GoogleMapReact>
|
||||
bootstrapURLKeys={{ key: [YOUR_KEY] }}
|
||||
zoom={zoom}
|
||||
center={center}
|
||||
heatmapLibrary={true}
|
||||
heatmap={{data}}
|
||||
>
|
||||
{markers}
|
||||
</GoogleMapReact>
|
||||
```
|
||||
|
||||
#### 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
|
||||
<GoogleMapReact
|
||||
bootstrapURLKeys={{
|
||||
key: [YOUR_KEY],
|
||||
libraries:['places', 'geometry', 'drawing', 'visualization']
|
||||
}}
|
||||
{markers}
|
||||
</GoogleMapReact>
|
||||
```
|
||||
|
||||
@ -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
|
||||
|
||||
|
||||
@ -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}`,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user