Нарисуйте, отредактируйте и сохраните сразу несколько полигонов листовки.Редактируемый

#leaflet #drawing #polygon

Вопрос:

в Листовке.Редактируемый Мне нужно нарисовать несколько полигонов, иметь возможность редактировать их и в конце сохранить их как GeoJSON или удалить их все вместе с помощью внешней кнопки. Я могу сделать это с помощью одного многоугольника:

 map = new L.Map('mapa', {
    maxBounds: extent,
    minZoom: 12,
    zoomControl:false,
    touchZoom: true,
    tap: false,
    editable:true,
    attributionControl:true,
    zoomControl: true
    });
    
$('body').on('click','#start_drawing',function(e){
    newPolygon=map.editTools.startPolygon('',{color:'#d7191c', opacity:0.8, weight: 5,fillColor:'#d7191c', fillOpacity:0.2});
});

$('body').on('click','#delete_drawing',function(e){
    map.removeLayer(newPolygon);
});

$('body').on('click','#save_drawing',function(e){
    newPolygon.toGeoJSON();
});
 

Я попытался установить FeatureLayer для LeafletEditable, но он создал пустую группу слоев.

Спасибо за помощь, Дэн

Ответ №1:

Группировка новых полигонов-это правильный путь, но вам нужно создать группу, чтобы удерживать их вне обратных вызовов для элементов управления. Сначала добавьте пустую группу на карту, а затем добавьте в нее новые полигоны по мере их создания. Что-то в этом роде должно сработать:

 map = new L.Map('mapa', {
    maxBounds: extent,
    minZoom: 12,
    zoomControl:false,
    touchZoom: true,
    tap: false,
    editable:true,
    attributionControl:true,
    zoomControl: true
});

const fg = L.featureGroup().addTo(map);

$('body').on('click','#start_drawing',function(e){
    const newPolygon=map.editTools.startPolygon('',{color:'#d7191c', opacity:0.8, weight: 5, fillColor:'#d7191c', fillOpacity:0.2});
    fg.addLayer(newPolygon);
});

$('body').on('click','#delete_drawing',function(e){
    fg.clearLayers();
});

$('body').on('click','#save_drawing',function(e){
    let geoJSON = fg.toGeoJSON();
    // Do something with geoJSON...
});