LeafletBundle/Resources/public/js/leaflet-map.js

window.SONATA_CONFIG.USE_ICHECK = true;

var map,
    defaultCoords,
    drawnItems,
    marker,
    loc,
    dataValue;

$(document).ready(function () {
    defaultCoords = new L.latLng(_MAP_LATITUDE, _MAP_LONGITUDE);
    map = new L.Map('map', {zoom: getZoomLevel(), center: getDataCoords()});
    drawnItems = L.featureGroup().addTo(map);

    drawMarker();

    L.control.layers(
        {
            'openstreetmap': L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
                {
                    maxZoom: 18,
                    attribution: '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors'
                }).addTo(map),
            "google": L.tileLayer('http://www.google.com.ar/maps/vt?lyrs=y@189&gl=cn&x={x}&y={y}&z={z}',
                {
                    maxZoom: 18,
                    attribution: 'google'
                })
        },
        {
            'drawlayer': drawnItems
        },
        {
            position: 'topleft',
            collapsed: false
        }).addTo(map);

    map.on('zoomend', function () {
        setDataValue();
    });

});

// Espera que el tab mostrado tenga la clase CSS 'active' y hace un refresh del mapa
// debido a que al estar oculto en un tab no se muestra con el tamaño correcto
var tab_id;
$('.nav-tabs a').on('click', function () {
    tab_id = $(this).attr('href');
    checkForChanges();
});

function checkForChanges() {
    if ($(tab_id).hasClass('active')) {
        map._onResize();
    } else {
        setTimeout(checkForChanges, 500);
    }
}

function getDataCoords() {
    var jsonParseData = {};
    if ($('[name$="[extraData]"]').val()) {
        dataValue = $('[name$="[extraData]"]').val();
    }
    if (dataValue) {
        jsonParseData = JSON.parse(dataValue);
    }
    loc = defaultCoords;
    if (jsonParseData.lat && jsonParseData.lng) {
        loc = new L.latLng(jsonParseData.lat, jsonParseData.lng);
    }

    return loc;
}

function drawMarker() {
    if (marker) {
        drawnItems.removeLayer(marker);
    }
    map.panTo(loc);
    marker = L.marker([loc.lat, loc.lng]);
    drawnItems.addLayer(marker);
}

function getZoomLevel() {
    var jsonParseData = {};
    var zoomLevel = 18;
    if ($('[name$="[extraData]"]').val()) {
        dataValue = $('[name$="[extraData]"]').val();
    }
    if (dataValue) {
        jsonParseData = JSON.parse(dataValue);
    }
    if (jsonParseData.zoom) {
        zoomLevel = jsonParseData.zoom;
    }

    return zoomLevel;
}