Double rotation is applied to markers if this package is used along with RotatedMarker

[EpicUsername12]

Explanation

The rotation is applied twice if you're using leaflet-polylinedecorator and leaflet-rotatedmarker.

In the marker HTML that is then generated by Leaflet, we can see the following:

<img ... style="... transform: translate3d(226px, -107px, 0px) rotateZ(179.118deg) rotateZ(179.118deg); ... ">

The rotateZ() is present 2 times.

This is because the package is already reusing the same Marker.include(...) as leaflet-rotatedmarker:

https://github.com/bbecquet/Leaflet.PolylineDecorator/blob/96858e837a07c08e08dbba1c6751abdec9a85433/dist/leaflet.polylineDecorator.js#L127-L183

As you can see in the above code, it's the same code as: https://github.com/bbecquet/Leaflet.RotatedMarker/blob/master/leaflet.rotatedMarker.js

If you are using both packages, it means that the standard leaflet Marker will be replaced by an extension (A) that applies rotation. (by leaflet-rotatedmarker)

And this new extension (A) will be once again extended (B, by leaflet-polylinedecorator) to apply the same rotation.

Now the Marker "class" of leaflet points to B.

And as we can see in the code, the _setPos function always call the "super" function before applying the rotation.

The call chain will be: B -> A -> original Marker

But B and A both applies the rotation, causing the bug.

Another issue is that leaflet-rotatedmarker is also a depedency for this package which makes it so in most settings, you cannot avoid this bug even if you want to rotate markers with PolylineDecorator alone.

Workaround(s)

• The simplest fix is to divide the rotation angle by 2 and comment why you did so
• Create your own rotated marker extension, that do not replace the real Marker
• Manually change the code to handle such cases, but then it creates code that is very hard to maintain