<!--
Usage:
  All parameters are optional except lat/lon.
-->
<div id="osm-map-{{ .Get "lat" }}-{{ .Get "lon" }}-{{ .Get "zoom" | default "15" }}" style="height:{{ .Get "height" | default "400px" }};"></div>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script>
(function () {
    var mapId = "osm-map-{{ .Get "lat" }}-{{ .Get "lon" }}-{{ .Get "zoom" | default "15" }}";
    if (!window._osm_maps) window._osm_maps = {};
    if (!window._osm_maps[mapId]) {
        var map = L.map(mapId).setView(
            [{{ .Get "lat" }}, {{ .Get "lon" }}],
            {{ .Get "zoom" | default "15" }}
        );
        L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            maxZoom: 19,
            attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
        }).addTo(map);
        L.marker([{{ .Get "lat" }}, {{ .Get "lon" }}]).addTo(map);
        window._osm_maps[mapId] = map;
    }
})();
</script>