I am using d3.js to draw svgs on a basic map in Leaflet. I want my custom pane lay on top. I have created a pane and it works just fine. However, when zoomed-in and I pan the map the area, which was outside the map view before, is not re-drawn on the custom pane and remains empty. I was assuming that the custom pane behaves the same as the built-in panes and updates the position according to movement.

Obviously the svg in the custom pane is missing the correct view box and translate attribution:

dom

Resulting in incomplete information in the view after panning:

Borders in red are only drawn where the “old” view was

What am I doing wrong here? Any ideas?

Thanks a lot!