# j-Leaflet

> This component uses [Leaflet](https://leafletjs.com/) library with the [OpenStreetMap](https://www.openstreetmap.org/) map engine. The component uses 3rd party dependencies.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: en
Content-SHA256: ba295cb1b566c08425730ecbecbab7f260aaac3d696ee7379be4d5b82963f931
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

This component uses [Leaflet](https://leafletjs.com/) library with the [OpenStreetMap](https://www.openstreetmap.org/) map engine. The component uses 3rd party dependencies.


__Configuration__:

- `height {Number/String}` fixed height or a parent element (default: `200`)
- `margin {Number}` a margin for parent element (default: `0`)
- `marker {Boolean}` enables marker (default: `true`)
- `draggable {Boolean}` enables draggable marker (default: `false`)
- `zoom {Number}` a default zoom level (default: `10`)
- `maxzoom {Number}` a maximum zoom level (default: `19`)
- `icon {String}` a URL to the default marker icon
- `iconanchor {String}` optional, icon anchor in the for `x,y` (default: `undefined`)
- `iconsize {String}` optional, icon size in the for `w,h` (default: `undefined`)
- `move {String}` move event - a link to the function or variable `function(pos)`
- `click {String}` a marker click event - a link to the function or variable `function(pos)`
- `center {String}` a default location (e.g. `Bratislava, Slovakia`) if the `setter` value is empty/nullable
- __NEW__: `exec {String}` optional, a link to the `function(value, component)` (it will be executed when the value is changed)

__Methods__:

- `component.search(location, callback)` searchs locality in the OpenStreetMap API (response is array)
- `component.parse(pos)` returns parsed GPS to array `[lat, lon, zoom]`
- `component.center(pos)` centers map to the specific position

Use it with `<ui-component name="leaflet">`. When the component is not loaded yet, jComponent downloads it on first use from the address in `DEF.fallback` (the Componentator CDN by default). Author: Peter Širka. Source: the Componentator components repository, MIT license.

```html example.html
<div style="width:400px">
	<ui-component name="leaflet" path="totalgps" config="height:200"></ui-component>
</div>

<script>
	var totalgps = '48.7357552902333, 19.1465583527431';
</script>
```