https://github.com/payloaddev/react-simple-google-maps
Simple components for rendering Google Maps via the Google Maps JavaScript API
https://github.com/payloaddev/react-simple-google-maps
Last synced: 8 months ago
JSON representation
Simple components for rendering Google Maps via the Google Maps JavaScript API
- Host: GitHub
- URL: https://github.com/payloaddev/react-simple-google-maps
- Owner: PayloadDev
- License: mit
- Created: 2016-10-19T17:35:37.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2016-10-20T15:50:02.000Z (over 9 years ago)
- Last Synced: 2025-07-24T13:59:51.449Z (8 months ago)
- Language: CoffeeScript
- Size: 7.81 KB
- Stars: 1
- Watchers: 5
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# react-simple-google-maps
Simple components for rendering Google Maps via the Google Maps JavaScript API
## Installation
`npm install react react-addons-shallow-compare react-simple-google-maps`
## Usage
Ensure the Google Maps JS API script is already loaded. `react-simple-google-maps` will use a global named `google.maps`.
To create a new map, just render a `` component. Markers and Polylines are children of the Map, and an InfoWindow can be a child of a Marker. An InfoWindow's children will be rendered into the InfoWindow when it is displayed.
Coordinates are passed using the native Google Maps coordinates or bounds objects.
```javascript
bounds = new google.maps.LatLngBounds();
position = new google.map.LatLng(65, -100);
bounds.extend(position);
position = new google.map.LatLng(40, -125);
bounds.extend(position);
markerPosition = new google.map.LatLng(50, -115);
I am a marker!
```