javascript - 传单编辑多边形问题

Question

我有一个 Leaflet 多边形，我想在管理界面中编辑它，但问题是它总是向我显示相同的多边形。如果我点击那支铅笔，它应该会显示一些不同的多边形，而不是相同的。我认为问题是当我点击保存时我需要刷新页面。我怎样才能做到这一点？我认为它会将其保留在缓存中...

这就是编辑的样子:

编辑代码为:

$(".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 数据库中获取了这个多边形。

Answer 1

我用 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;
  }

}