javascriptjsonleafletleaflet-geoman

LeafletJS GeoMan into JSON data


I've added GeoMan to my leaflet map and just wondering if there is a way I can export all the drawn features into JSON. I'm using it for development only so the JSON can go into console.log

I'm just struggling to work it out. This is the only code I have so far

map.pm.toggleGlobalDragMode();
map.pm.addControls({
  position: 'topright',
  editMode: true,



});

layer.pm.enable({ pinning: true, snappable: true })

Solution

  • You can use this code:

    function generateGeoJson(){
        var fg = L.featureGroup();    
        var layers = findLayers(map);
            layers.forEach(function(layer){
            fg.addLayer(layer);
             });
        console.log(fg.toGeoJSON());
    }
    
    function findLayers(map) {
        var layers = [];
        map.eachLayer(layer => {
          if (
            layer instanceof L.Polyline || //Don't worry about Polygon and Rectangle they are included in Polyline
            layer instanceof L.Marker ||
            layer instanceof L.Circle ||
            layer instanceof L.CircleMarker
          ) {
            layers.push(layer);
          }
        });
    
        // filter out layers that don't have the leaflet-geoman instance
        layers = layers.filter(layer => !!layer.pm);
    
        // filter out everything that's leaflet-geoman specific temporary stuff
        layers = layers.filter(layer => !layer._pmTempLayer);
    
        return layers;
      }
    

    Fiddle: https://jsfiddle.net/falkedesign/054go8j2/

    For more Information look into https://github.com/geoman-io/leaflet-geoman/issues/605

    Additional Information: