registros - como llenar una tabla en mysql

Cómo guardar un punto de polígono completado leaflet.draw en la tabla mysql

Question

Me gustaría utilizar leaflet.draw para crear contornos de regiones. He logrado que funcione correctamente: https://www.mapbox.com/mapbox.js/example/v1.0.0/leaflet-draw/

Ahora me gustaría guardar los datos de cada polígono en una tabla mysql. Estoy un poco atascado en cómo me gustaría exportar los datos y el formato en el que debería hacerlo.

Si es posible, me gustaría volver a colocar los datos en un mapa de mapbox / prospecto en el futuro, así que supongo que algo como Geojson sería bueno.

Answer 1

El método @Michael Evans debería funcionar si desea utilizar GeoJSON.

Si desea guardar puntos LatLngs para cada forma, podría hacer algo como esto:

map.on(''draw:created'', function (e) {
    var type = e.layerType;
    var layer = e.layer;
    var latLngs;

    if (type === ''circle'') {
       latLngs = layer.getLatLng();
    }
    else
       latLngs = layer.getLatLngs(); // Returns an array of the points in the path.

    // process latLngs as you see fit and then save
}

Answer 2

No olvides el radio del círculo.

            if (layer instanceof L.Circle) {
                shapes.push([layer.getLatLng()],layer.getRadius())
            }

PD: es posible que la declaración no obtenga el formato adecuado, pero puede ver el punto. (O mejor dicho, el radio y el punto ;-)

Answer 3

Obtener acciones como matriz asociativa + radio de círculo

  map.on(''draw:created'', function (e) {
        var type = e.layerType,
                layer = e.layer;

        if (type === ''marker'') {
            layer.bindPopup(''Call Point!'');
        }

        drawnItems.addLayer(layer);

        var shapes = getShapes(drawnItems);

        console.log("shapes",shapes);




    });


    var getShapes = function (drawnItems) {

        var shapes = [];
        shapes["polyline"] = [];
        shapes["circle"] = [];
        shapes["marker"] = [];

        drawnItems.eachLayer(function (layer) {

            // Note: Rectangle extends Polygon. Polygon extends Polyline.
            // Therefore, all of them are instances of Polyline
            if (layer instanceof L.Polyline) {
                shapes["polyline"].push(layer.getLatLngs())
            }

            if (layer instanceof L.Circle) {
                shapes["circle"].push([layer.getLatLng()])
            }

            if (layer instanceof L.Marker) {
                shapes["marker"].push([layer.getLatLng()],layer.getRadius());
            }

        });

        return shapes;
    };

Answer 4

Para mi funciono esto:

map.on(L.Draw.Event.CREATED, function (e) {
    map.addLayer(e.layer);
    var points = e.layer.getLatLngs();
  puncte1=points.join('','');
  puncte1=puncte1.toString();
  //puncte1 = puncte1.replace(/[{}]/g, '''');
  puncte1=points.join('','').match(/([/d/.]+)/g).join('','')
//this is the field where u want to add the coordinates
$(''#geo'').val(puncte1);
});

Answer 5

Por lo tanto, podría usar draw: creado para capturar la capa, convertirlo a geojson y luego modificarlo para guardar en su base de datos. Solo he hecho esto una vez y estaba sucio pero funcionó.

map.on(''draw:created'', function (e) {
  var type = e.layerType;
  var layer = e.layer;

  var shape = layer.toGeoJSON()
  var shape_for_db = JSON.stringify(shape);
});

Answer 6

Si quieres recoger las coordenadas, puedes hacerlo de esta manera:

var drawnItems = new L.FeatureGroup();
map.addLayer(drawnItems);

map.on(''draw:created'', function (e) {

    var type = e.layerType,
        layer = e.layer;

    drawnItems.addLayer(layer);

    var shapes = getShapes(drawnItems);

    // Process them any way you want and save to DB
    ...

});

var getShapes = function(drawnItems) {

    var shapes = [];

    drawnItems.eachLayer(function(layer) {

        // Note: Rectangle extends Polygon. Polygon extends Polyline.
        // Therefore, all of them are instances of Polyline
        if (layer instanceof L.Polyline) {
            shapes.push(layer.getLatLngs())
        }

        if (layer instanceof L.Circle) {
            shapes.push([layer.getLatLng()])
        }

        if (layer instanceof L.Marker) {
            shapes.push([layer.getLatLng()]);
        }

    });

    return shapes;
};

Answer 7

map.on(''draw:created'', function (e) {
  var type = e.layerType;
  var layer = e.layer;

  var shape = layer.toGeoJSON()
  var shape_for_db = JSON.stringify(shape);
});

// restore
L.geoJSON(JSON.parse(shape_for_db)).addTo(mymap);