Leaflet Edit Polygon Ausgabe

Question

Ich habe ein Leaflet Polygon, das ich in der Admin-Oberfläche bearbeiten möchte, aber die Sache ist, dass es mir immer das gleiche Polygon zeigt. Wenn ich auf diesen Stift klicke, sollte er mir einige verschiedene Polygone zeigen, nicht dasselbe. Ich denke, das Problem ist, dass ich die Seite aktualisieren muss, wenn ich auf Speichern klicke. Wie kann ich das machen? Ich denke, es hält sie auf dem Cache ...

Und das ist, was es wie das Bearbeiten aussieht:

Der Code für die Bearbeitung ist:

$(".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); 
      }); 
     }); 

Ich weiß nicht, wo das Problem ist, irgendwelche Ideen? Übrigens, ich nehme diese Polygone aus der MYSQL-Datenbank.

Answer 1

beschloß ich, das Problem mit einer 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; 
    } 

}