x-cite-google-maps
v1.0.1
Published
first package
Downloads
23
Maintainers
Readme
x-cite-google-maps
x-cite-google-maps is a reactjs package, helps you to use google maps into any reactjs app with many features
- Custom Markers
- Custom infoWindow popups
- Points
Installation
x-cite-google-maps requires Reactjs v15+ to run.
$ npm install x-cite-google-maps
$ yarn add x-cite-google-maps
then import the package into the used component
import MapsDemoXcite from 'x-cite-google-maps'
Configuration
x-cite-google-maps is currently extended with the following plugins. Instructions on how to use them in your own application are linked below.
<MapsDemoXcite points={points} config={mapConfig.key} styles={style}
/>
points object should looks like this:
const points = [ {lat: 54.2, lng: -4.6, info:{key11:"value 11", key12: "value12", key13:"value13"},icon:"http://maps.google.com/mapfiles/ms/icons/red-dot.png" }, {lat: 53.2, lng: -4.7, info:{key21:"value 21", key12: "value22", key13:"value23" }}, {lat: 52.2, lng: -4.8, info:{key21:"value 31", key12: "value32", key13:"value33" }} ]
the key object need to be defined:
const mapConfig = { key: '**********' };
and some styles for the container:
const style = { width: '100%', height: '536px' }