### Developed by [Neshan Maps Platform team](https://platform.neshan.org). ### For Farsi/Persian document, [click here](https://developers.neshan.org/react-component/).
npm install neshan-mapoptions prop to NeshanMap component and import NeshanLeaflet stylesheet.
javascript
import React, { FC } from 'react';
import NeshanMap from 'neshan-map';
const SimpleMap: FC = () => {
return (
key: 'YOUR_API_KEY',
maptype: 'dreamy',
poi: true,
traffic: false,
center: [35.699739, 51.338097],
zoom: 13,
}}
/>
);
};
export default SimpleMap;
`
Installation
npm:
`
npm i neshan-map
`
Features
$3
You can access to Leaflet Maps L , map objects by using onInit.
`javascript
...
key: 'YOUR_API_KEY',
maptype: 'dreamy',
poi: true,
traffic: false,
center: [35.699739, 51.338097],
zoom: 13
}}
onInit={(L, myMap) => {
let marker = L.marker([35.699739, 51.338097])
.addTo(myMap)
.bindPopup('I am a popup.');
myMap.on('click', function (e) {
marker.setLatLng(e.latlng)
});
L.circle([35.699739, 51.348097], {
color: 'red',
fillColor: '#f03',
fillOpacity: 0.5,
radius: 500
}).addTo(myMap);
}}
/>
``