links in draw.io don't work

[juliacherry12]

Hi. We have a problem.
When adding external and internal custom links and saving the chart, it fails to make them work on the wiki page.
When opening the same page in a browser (web version) of draw.io, everything works.

In our case, references stop working because of the large number of objects in the draw.io diagram.
With a small number of objects the links work, with a larger number they break.

This makes it impossible to create large diagrams with references to the description.

Help to solve the problem, please. Is there a way to solve it?

Wiki.js: v.2.5.295
NodeJS: v14.17.2

[BrianLakstins]

My diagram is not very big, and I can't get links to work either. If I download the file as HTML, or even preview it, the link works. The link does not work on the embedded diagram on my wikijs page.

[juliacherry12]

Greetings, we have partially found a solution. We needed to set all elements in the diagram to false for the two checkboxes in the figure.

However, the internal links are still not working. To create interactive diagrams, it is not possible to implement buttons and work with layers.

[hennning]

I have this exact same issue.
Also, when creating a link on a figure it makes the whole image a link to that URL, not just that particular object.
If you have multiple links on the same draw only the latest link becomes clickable.

This, however does not happen on some object.
For example if I create a link on the Wordpress symbol it seems to work fine. (https://cdn1.iconfinder.com/data/icons/social-media-vol-3/24/_wordpress-128.png)

All this is solved by unchecking the Word Wrap and Formatted Text buttons as described above. But this of course creates new issues/complications when designing your flow chart.

[MrStandalone]

Currently trialing use of WikiJS and was wanting to embed diagrams for flow charts with clickable links so I was saddened to hear this was an issue, had a look into it and I was able to fix this across all of our diagrams by adding a CSS override into the WikiJS theme as below

div.diagram foreignObject {
  pointer-events: none;
}

The SVG generated from draw.io using the Embed / Export options contains pointer-events: none on all of the foreignObject elements however when rendered in WikiJS they're missing so this is a bit of a workaround for that.

Unsure if this will have any further effects or issues with embedded diagrams, still testing all of our diagrams, use at your own risk.

[nmella]

Works awesome ! Thank you !