2017-08-30 64 views
1

我有一个Leaflet多边形,我想在管理界面中对其进行编辑,但事情是它总是向我显示相同的多边形。如果我点击那支铅笔,它应该会显示一些不同的多边形,不一样。我认为问题在于我点击保存时需要刷新页面。我怎样才能做到这一点?我认为它保持它的缓存...单张编辑多边形问题

enter image description here

而这正是它看起来像编辑:

enter image description here

编辑的代码是:

$(".edit_zona").click(function(){ 
      var id_zona = $(this).attr("id").substring(10); 
      $.ajax({ 
       type: "POST", 
       url: "ajax/edit_zona.php", 
       data:{ 
       id: id_zona 
       }, 
        cache:false, 
        dataType: "html" 

      }).done(function(ms){ 
       $("#response").html(ms); 
       var osmUrl = 'https://api.mapbox.com/styles/v1/mapbox/streets-v10/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWVnYTYzODIiLCJhIjoiY2ozbXpsZHgxMDAzNjJxbndweDQ4am5mZyJ9.uHEjtQhnIuva7f6pAfrdTw', 
      osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors', 
      osm = L.tileLayer(osmUrl, { maxZoom: 18, attribution: osmAttrib }), 
      map = new L.Map('map', { center: new L.LatLng(44.9323281,26.0306833), zoom: 12.25 }), 
      drawnItems = L.featureGroup().addTo(map); 
    L.control.layers({ 
     'osm': osm.addTo(map) 
    },).addTo(map); 

     function stringToGeoPoints(geo) { 
    var linesPin = geo.split(","); 

    var linesLat = new Array(); 
    var linesLng = new Array(); 

    for(i=0; i < linesPin.length; i++) { 
    if(i % 2) { 
    linesLng.push(linesPin[i]); 
    }else{ 
    linesLat.push(linesPin[i]); 
    } 
    } 

    var latLngLine = new Array(); 

    for(i=0; i<linesLng.length;i++) { 
    latLngLine.push(L.latLng(linesLat[i], linesLng[i])); 
    } 

    return latLngLine; 
    } //I think here it's the problem 
    var zona = JSON.parse('<?php echo json_encode($arr) ?>'); 
    for(var i=0; i < zona.length; i++) { 
    var polygon = L.polygon(stringToGeoPoints(zona[i]['geolocatii']), { color: 'red'}); 
    polygon.editing.enable(); 
    polygon.addTo(map); 
    } 
    map.addControl(new L.Control.Draw({ 
    draw : { 
     position : 'topleft', 
     polygon : true, 
     polyline : false, 
     rectangle : false, 
     circle : false, 
     marker: false, 
     circlemarker: false 
    }, 
    edit : { 
     featureGroup: drawnItems, 
     remove: false 
    } 

    })); 
    var featureGroup = L.featureGroup().addTo(map); 
    map.on("click", function(e){ 
     poligon= polygon.getLatLngs(); 
     poligon2=poligon.join(',').match(/([\d\.]+)/g).join(',') 

     $('#geo').val(poligon2); 
    console.log(poligon2); 
    }); 
    var arr = JSON.parse('<?php echo json_encode($arr) ?>'); 
    // console.log(arr); 
      }); 
     }); 

我不知道问题出在哪里,有什么想法?顺便说一下,我从MYSQL数据库中获取这个多边形。

回答

0

我解决了问题用if:

for(var i=0; i < arr.length; i++) { 
    if(id_zona==arr[i]['id']){ 
    var polygon = L.polygon(stringToGeoPoints(arr[i]['geolocatii']), { color: 'red'}).addTo(map); 
    polygon.editing.enable(); 
     console.log(polygon); 
    break; 
    } 

}