Install
Install the component using bower:
$ bower install leaflet-map-component
Getting Started
To get started you need to import the web components polyfill, then the web component itself.
<head>
<script src="path_to_bower/platform/platform.js"></script>
<link
rel="import"
href="path_to_bower/leaflet-map-component/leaflet-map-component.html">
</head>
<body>
<leaflet-map
longitude="72.82150268554686"
latitude="18.92926454727215"
zoom="14">
</leaflet-map>
</body>
Adding markers
Adding markers, circles and other features is easy. Use the required feature tag within your map element.
<leaflet-map fitToMarkers>
<leaflet-marker longitude="77.2293" latitude="28.6129">
I am a marker
</leaflet-marker>
<leaflet-circle longitude="77.2197" latitude="28.6328" radius="300">
I am a circle
</leaflet-circle>
<leaflet-rectangle topleft="[54.559322, -5.767822]" bottomright="[56.1210604, -3.021240]" >
I am a rectangle
</leaflet-rectangle>
</leaflet-map>
Tiles
Change the look of your map easily by switching to a different tile server.
<leaflet-map
longitude="73.8278"
latitude="15.4989"
tileServer="http://b.tile.thunderforest.com/cycle/{z}/{x}/{y}.png">
</leaflet-map>
Polygons & Polylines
You can create polygons and polylines by adding points inside these elements.
<leaflet-map longitude="77.5667" latitude="12.9667" zoom="11">
<leaflet-polyline>
<leaflet-point longitude="77.6400" latitude="12.9100"></leaflet-point>
<leaflet-point longitude="77.6229" latitude="12.9259"></leaflet-point>
<leaflet-point longitude="77.6499" latitude="12.9699"></leaflet-point>
<leaflet-point longitude="77.6119" latitude="12.9738"></leaflet-point>
</leaflet-polyline>
<leaflet-polygon>
<leaflet-point longitude="77.5700" latitude="12.9700"></leaflet-point>
<leaflet-point longitude="77.6034" latitude="13.0001"></leaflet-point>
<leaflet-point longitude="77.6006" latitude="12.9547"></leaflet-point>
</leaflet-polygon>
</leaflet-map>
Dive Deeper
Take a deeper look at the web component by reading its documentation and cloning the code. Contribute by raising issues for features and bugs or by sending pull requests.