Link from within an SVG to an anchor on the same page doesn't work

Jürgen Hulverscheidt

Hey everyone!

I'm working with server-based Confluence 7.4.11.

I created a diagram in Adobe Illustrator and assigned hyperlinks to certain boxes inside the diagram via Illustrator's »Attributes« palette. The hyperlinks just point to anchors on the same page, so they look just like #story or #task.

I saved the diagram as SVG, copied the source code (directly available from Illustrator's Save as SVG dialog) and inserted it into the Confluence page via the HTML macro.

The browser displays the SVG perfectly fine and also recognizes the links attached to certain elements in the SVG. When hovering above such an element, the destination URL shown in the lower left corner of the browser window is composed from the URL of the current page plus the anchor, e.g. http://confluence…/…/pages/viewpage.action?pageId=1234#story.

Further down the Confluence page, I inserted the corresponding anchors via the Anchor macro (example: story), e.g. inside the first cell of a table row (the table explains the meanings of the individual elements in the SVG).

But when I click on the element in the SVG, nothing happens. I expected the page to jump to the location of the corresponding anchor further down the page in the table with the explanations.

Any idea where the problem could be?

• Don't anchors work in combination with page URLs containing page IDs? But what if the page title contains a special character so that using the page title itself for the URL won't work?
• Or is the problem that I inserted the anchor in a table cell? I tried to put the anchor outside a table cell in a regular paragraph but that didn't work, either.

Thanks a lot for any insight!

Best,
Jürgen

Jürgen Hulverscheidt

Hi again!

I dug a little deeper with the help of Chrome's developer tools and saw that even though I only entered e.g. »story« into the Anchor macro, Confluence turned that into id="pagename-story" instead of just id="story" in the final HTML code. So I had predicted the anchor names assigned by Confluence wrongly when I inserted them into the Illustrator graphic.

Now, yes, the page jumps down when I click on one of the boxes inside the SVG but it does not jump to the correct location where I added the anchor. Actually, the location where I added the anchor (table cell) is just outside the visible area of the page, i.e. the browser scrolls down too far so the destination of the link (anchor) gets pushed up out of the visible area quite a bit.

Question: Is that a general issue when trying to jump to a certain anchor on the same Confluence page or a different one? Normally, I'd expect the location of the anchor (e.g. a heading) to be at the top of the browser window after the jump (given there's still enough content below the anchor to fill the window).

Thanks again!

Best,
Jürgen