Cannot remove layer containing decorator from map about leaflet.polylinedecorator HOT 10 CLOSED

Hi, and sorry for the long wait, I haven't had much time to work on this project lately.
I couldn't reproduce your case, but I miss details.
I tried the following:

    var pl = L.polyline([[51.51462, -0.12377], [51.5133, -0.12207]], {color: "#ff7800", weight: 1});
    var pd = L.polylineDecorator(pl, {
        patterns: [{offset: 0, repeat: 10, symbol: L.Symbol.dash({pixelSize: 0})}]
    });

    var lg = L.layerGroup([pl, pd]);
    map.addLayer(lg);
    map.removeLayer(lg);

Namely: adding a polyline and a decorator to the same LayerGroup, adding this group to the map, then removing it. And it's working.

Is it what you meant? Do you still experience the problem?

from leaflet.polylinedecorator.

I am having a similar issue..

leaflet 0.7.2.
Using the leaflet-0.7.2 branch of PolylineDecorator.

So in our project the requirement is if one polyline is clicked, it should add the decorators. When a different polyline is clicked, it should remove the decorators from the previous polyline and add them to the newly selected polyline.

I have a feature group containing many polylines that are displayed on the map. Each has an on click event which adds the polyline decorator(s) to the feature group so they show up on the polyline on the map. That works flawlessly.

During the on click, any decorators added to the polyline are placed into an array for access later when they need to be removed.

When the next polyline is clicked, it checks to see if there are any decorators in that array. If so, it loops through them and calls removeLayer on the feature group passing in the decorator. This is where I experience the error...

Uncaught TypeError: layer.off is not a function
L.FeatureGroup.L.LayerGroup.extend.removeLayer @ leaflet-src.js:4423
(anonymous function) @ origindestination.js:197
forEach @ angular.js:323
(anonymous function) @ origindestination.js:196
L.Mixin.Events.fireEvent @ leaflet-src.js:461
L.Path.L.Browser.canvas.L.Path.extend._onClick @ leaflet-src.js:5176
L.Mixin.Events.fireEvent @ leaflet-src.js:473
L.Map.L.Class.extend._fireMouseEvent @ leaflet-src.js:2224
L.Map.L.Class.extend._onMouseClick @ leaflet-src.js:2204
L.DomEvent.addListener.handler @ leaflet-src.js:6402

from leaflet.polylinedecorator.

Can i ask why the clearLayer() method not working for polyline decorators???
As it gives console error : Uncaught TypeError: layer.off is not a function
I been trying to figure out as i am new to javascript, couldn't quite understand the problem....
Although line decorator did brilliant job, thanks to you sir

from leaflet.polylinedecorator.

Hi, and thanks for using my plugin.
As I had problems in the past trying to reproduce this bug, can you please provide some minimal code that shows the issue?

from leaflet.polylinedecorator.

Thanks for reply, yes like where currentFeatureGroup() is having these decorators

new L.Marker(e.latlng, { icon: wallIcon, draggable: false }).addTo(currentFeatureGroup);
polylineWall.addLatLng([e.latlng.lat,e.latlng.lng]).addTo(currentFeatureGroup);
// Add coordinate to the polyline
//polylineWall.addLatLng(e.latlng).addTo(currentFeatureGroup);
var decorator = L.polylineDecorator(polylineWall, {
patterns: [
// define a pattern of 10px-wide dashes, repeated every 20px on the line
{ offset: 0, endOffset: 0, repeat: '30px', symbol: new L.Symbol.dash({pixelSize: 5 })}
]
}).addTo(currentFeatureGroup);

from leaflet.polylinedecorator.

By what I can guess, this code is a click event callback, where you add a point to a polyline, right?
Indeed, when I use it like that and call clearLayer on the currentFeatureGroup, I get the error.

I'll see what I can do, thanks for your help.

from leaflet.polylinedecorator.

ok thanks, looking forward to the fix

from leaflet.polylinedecorator.

Ok, the cause of the bug is because Leaflet's implementation of FeatureGroup assumes every layer it includes is event-enabled, and thus has the on() & off() methods… which isn't the case for the LayerGroup class, from which PolylineDecorator derives.

I'm writing this down as a reference, I didn't decide the best way to fix it yet. I could add the methods, but I would like to avoid side-effects. And actually, it even looks like a Leaflet bug to me.

As a workaround until it's fixed, if you don't need events on the group itself (it's ok with the individual layers like the polyline or markers), you could use a LayerGroup instead of a FeatureGroup.

from leaflet.polylinedecorator.

As I thought, it is actually a bug in Leaflet, and I just found it has been fixed some days ago: Leaflet/Leaflet#3869
So I won't change anything on my side, as it's not where the problem is.

For a better workaround until the fixed Leaflet version is released, I suggest you add this line at the beginning of your program:

L.PolylineDecorator.include(L.Mixin.Events);

This adds the event methods to PolylineDecorator, so it's usable in current FeatureGroups without error.

from leaflet.polylinedecorator.

Brilliant, thanks, problem resolved, i appreciate your effort,,,cheers

from leaflet.polylinedecorator.