Skip to content

Update README.md #698

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Dec 18, 2018
Merged

Update README.md #698

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
3c020ac
Update README.md
itsmichaeldiego Dec 18, 2018
c6e5970
Update README.md
itsmichaeldiego Dec 18, 2018
ff0d187
Update README.md
itsmichaeldiego Dec 18, 2018
b53491e
Add javascript tag
itsmichaeldiego Dec 18, 2018
1fd5216
Update README.md
itsmichaeldiego Dec 18, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 33 additions & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ class SimpleMap extends Component {
<AnyReactComponent
lat={59.955413}
lng={30.337844}
text={'Kreyser Avrora'}
text="My Marker"
/>
</GoogleMapReact>
</div>
Expand Down Expand Up @@ -83,6 +83,38 @@ It renders components on the map before (and even without) the Google Maps API l

There is no need to place a `<script src=` tag at top of page. The Google Maps API loads upon the first usage of the `GoogleMapReact` component.

### Anything you can do with Google Maps, you can do with Google Map React

You can access to Google Maps `map` and `maps` objects by using `onGoogleApiLoaded`, in this case you will need to set `yesIWantToUseGoogleMapApiInternals` to `true`

```javascript
...

const handleApiLoaded = (map, maps) => {
// use map and maps objects
};

...

<GoogleMapReact
bootstrapURLKeys={{ key: /* YOUR KEY HERE */ }}
defaultCenter={this.props.center}
defaultZoom={this.props.zoom}
yesIWantToUseGoogleMapApiInternals
onGoogleApiLoaded={({ map, maps }) => handleApiLoaded(map, maps)}
>
<AnyReactComponent
lat={59.955413}
lng={30.337844}
text="My Marker"
/>
</GoogleMapReact>
```

PST: Remember to set `yesIWantToUseGoogleMapApiInternals` to true.

[Example here](https://github.com/google-map-react/google-map-react-examples/blob/master/src/examples/Main.js#L69)

### Internal Hover Algorithm

Now every object on the map can be hovered (however, you can still use css hover selectors if you want). If you try zooming out here [example](http://google-map-react.github.io/google-map-react/map/main), you will still be able to hover on almost every map marker.
Expand Down