mapmyindia-react
Version:
React map component for mapmyIndia (https://www.mapmyindia.com/api/advanced-maps/doc/interactive-map-api)
104 lines (80 loc) • 2.51 kB
Markdown
# MapmyIndia react
React component to implement [MapmyIndia Interactive Map API](https://www.mapmyindia.com/api/advanced-maps/doc/interactive-map-api)
## Getting Started
demo: https://mapmyindia-react-example.herokuapp.com/
### Prerequisites
Integrate interactive maps from MapmyIndia into your browser application by simply including MapmyIndia's interactive map API in your script source in the head section.
```
<script src="https://apis.mapmyindia.com/advancedmaps/v1/<Lic_Key>/map_load?v=1.3"></script>
```
### Installing
```
npm install mapmyindia-react --save
```
### How to use
```
import Map from "mapmyindia-react";
class App extends React.Component {
render () {
return (
<Map
markers={[
{
position: [18.5314, 73.845],
draggable: true,
title: "Marker title",
onClick: e => {
console.log("clicked ");
},
onDragend: e => {
console.log("dragged");
}
}
]}
/>
)
}
}
```
### Props
| prop | type | default value |
| ----------- | ------ | :----------------: |
| center | array | [18.5314, 73.8446] |
| zoomControl | bool | true |
| location | bool | true |
| height | string | 500px |
| width | string | |
| zoom | number | 15 |
| hybrid | bool | true |
| search | bool | true |
| markers | array | [] |
Example for marker array
```
[
{
position: [], // [lat, lng]
draggable: false, // true / false
title: '', // string
onClick: () => {}, // Marker click event listener
onDragend: ()=> {} // Marker dragend event listener (if draggable is set)
}
]
```
Map events
| Event | default value |
| ------------- | :-----------: |
| onResize| () => {} |
| onZoom| () => {} |
| onMove| () => {} |
| onClick| () => {} |
| onDblclick| () => {} |
| onMouseup| () => {} |
| onMousedown| () => {} |
| onMouseover| () => {} |
| onMouseout| () => {} |
| onKeypress| () => {} |
| onMapLoad| (mapObject) => {} |
## Author
- **Harish S Khot**
## Acknowledgments
- MapmyIndia Interactive Map API