remove added layer from map

[amirsamani]

hi
I have added a layer to the map with below code and after I want to remove that layer from the map, how can I do this?

        vectorUrl ='http://localhost:7800/asphalt/{z}/{x}/{y}.pbf';

        vectorTileStyling[vectorLayerId] = {
            fill: true,
            fillColor: 'green',
            fillOpacity: 0.1,
            color: 'green',
            opacity: 0.7,
            weight: 2,
            // dashArray: '2, 6',
        }

        var vectorTileOptions = {
            rendererFactory: L.canvas.tile,
            subdomains: '0123',	// 01234 for openmaptiles, abcd for mapbox
            vectorTileLayerStyles: vectorTileStyling
        }

            bandar_asphalt = L.vectorGrid.protobuf(vectorUrl, vectorTileOptions).addTo(MAP);`

[amirsamani]

Does anyone know how this is done?

[dpakprajul]

This code snippet could help you to remove the added layer from the map. If you click on the map, the just-added layer will be removed. Or you can introduce a button in HTML and write a Jquery.

HTML:

VT Layer

JS:
//remove and add layer on clicking checkbox vt_layer using jquery
$("#vt_layer").click(function () {
if (this.checked) {
map.addLayer(bandar_asphalt);
} else {
map.removeLayer(bandar_asphalt);
}
}
);

Without using JQuery:
MAP.on("click", function (e) {
if (map.hasLayer(bandar_asphalt)) {
map.removeLayer(bandar_asphalt);
}
});

Before

After