Rought notation refuses to render more then once after SPA page swap

I'm using astro with the <ViewTransitions /> / <ClientRouter /> . If I disabled it, the rought notation script runs normally.

First render:

What I get after the first page swap:

Important to note that the svg does in fact exists. the paths are on the correct place, but they are invisible:

If I just resize the browser or the window, the paths become visible again.

Things I've tried

1. Using annotationGroup(annotations).hide(); to perform a "cleanup". It did not work.
2. Trying to remove the svgs before changing pages with a normal query selector. It did not work.
3. Trying to mess with the stroke-dashoffset: 178.486px; stroke-dasharray: 178.486px; properties of each path on each svg, by querySelecting them and performing the operation. It did not work.
4. Disabling the <ViewTransitions /> / <ClientRouter />. It does work but I don't want to deploy it thay way.