Is there any solution to make an svg path element which is loaded as an overlay on a leaflet map interactive? I want to change the color of the path on mouseover.
my suggestion was to try it with this code snippet:
SVG code:
<path style="fill:none;stroke:#000000;" d="m 97.4375,132.5 c 0,0 -1.786197,3.39036 -0.875,6.6875 1.280573,4.63371 7.3125,4.5 7.3125,4.5" />
the js I try to make the mouseover effect and popup in my leaflet overlay:
pathOverlay.setStyle('pointer-events: auto');
pathOverlay.addEventListener('mouseover', function () {
this.setAttribute('stroke-width', '3');
this.setAttribute('stroke', 'red');
});