2015-03-02 3 views
5

С помощью leaflet.js с помощью leaflet.draw.js после использования инструмента рисования, чтобы нарисовать одну из фигур на пользовательской карте. У меня есть форма, которая появляется, которая говорит сохранить или отменить. Если пользователь нажимает кнопку «Отмена», я хочу, чтобы рисунок был удален. Например, я рисовал прямоугольник.Как удалить слой чертежа в leaflet.draw?

Вот мой источник тока

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

    $("#add-drawing").fadeIn(500); 

    featureGroup.addLayer(e.layer); // Adds rectangle 

    $("a.cancelD").on("click", function() { 
     $("#add-drawing").fadeOut(500); 

     // THESE ARE THE METHODS I HAVE TRIED TO REMOVE THE RECTANGLE 
     map.removeLayer(layer); 
     featureGroup.removeLayer(layer); 
     map.removeLayer(e); 
     featureGroup.removeLayer(e); 
    });  
}); 

Все это, кажется, работает. Я могу использовать панель инструментов для удаления слоя, но тогда у меня не будет никакой информации, представленной в форме, которую я хочу отправить.

Как удалить объекты, которые я нарисовал, нажав кнопку отмены формы?

ответ

6

Поскольку вы добавляете в featureGroup, который, как вы говорите, работает, вы также должны удалить с featureGroup. Вызов featureGroup.removeLayer(e.layer) или featureGroup.removeLayer(layer) (потому что layer имеет ссылку на e.layer) должен работать.

Вот рабочий пример на Plunker: http://plnkr.co/edit/kPvYbH?p=preview

На мой взгляд, единственный вывод, может быть, что ваше мероприятие не стрелять или у вас возникли какие-то странные проблемы обзорного, но которые могут быть легко отлажена:

$("a.cancelD").on("click", function() { 
    console.log('Click fired!'); // Seeing this in your console, event works 
    console.log(featureGroup); // Should return featureGroup instance, scope ok 
    console.log(e.layer); // Should return polygon instance, scope ok 

    // If all of the above works, this should too 
    featureGroup.removeLayer(e.layer); 
});  
+1

Массивного пальца вверх .. Проблема был класс, я просто добавил идентификатор на кнопку отмены, и она работала .. Ваш живой пример того, что помогла мне понять это и тот факт, вы напомнили мне проверить, есть ли что-нибудь в консоли, а это не так. Спасибо! Живые примеры - лучшие! Вы можете отредактировать свой ответ, чтобы включить идентификатор вместо класса :) –

0

У меня был такой же выпуск. Для меня работало следующий раствор:

featureGroup.clearLayers (e.layer);

Надеется, что это поможет кому-то

Смежные вопросы