ctr

    map.on('moveend', function() { 
        updateMapLayer();
    });    
    
    var dataBounds, zoom, dataUrl, dataType;
    function updateMapLayer() {
        // W, S, E, N
        dataBounds = map.getBounds().getWest().toFixed(5) + ',' +
        map.getBounds().getSouth().toFixed(5) + ',' +
        map.getBounds().getEast().toFixed(5) + ',' + 
        map.getBounds().getNorth().toFixed(5);
        
        zoom = map.getZoom();  

        if( zoom <=8 ) {
            dataType = 1; // region = 1     <=8
        } else if ( zoom <= 10 ) {
            dataType = 2; // area = 2       <=10
        } else if ( zoom <= 12 ) {
            dataType = 3; // district = 3   <=12
        } else { // 
            dataType = 4; // building = 4   >=13
        };

        dataUrl = 'http://host:8080/api/polygon/fit_bounds/' + dataType + '/' + dataBounds + '/';
       

       
/*
        L.Map.include({
          'clearLayers': function () {
            this.eachLayer(function (layer) {
              this.removeLayer(layer);
            }, this);
          }
        });
*/        
/*        
        map.eachLayer(function (layer) {
            map.removeLayer(layer);
        });
*/       
        map.removeLayer(districtLayer);
        
        
        $.getJSON(dataUrl, function (data) {
            districtLayer.addData(data);
        });        
        districtLayer.addTo(map);  
 
        //alert(zoom)
 
    };
    
    
    var districtLayer = L.geoJson(null, {
      style: function (feature) {
        return {
          color: "green",
          fill: false,
          opacity: 0.5,
          clickable: false
        };
      }
    });