feature request: Hyperlinks in SVG

[gaocegege]

I am wondering if we can support hyperlinks in the generated SVG? For example, we can jump to the repositories page when clicking the corresponding section in the SVG.

Ref Hyperlinks/Anchors Inside SVG Graphics

[Nixinova]

When the SVG is loaded as an image the links wouldnt be clickable anyway

[lowlighter]

☝️ Indeed, that's the reason it was never implemented, and I doubt it'll ever get implemented since I think it's a browser restriction.

---

Howver, if you wish to have more interactive sections, you can try using the markdown template though (here's an example).
Basically it'll produce a markdown file that you can template with text, data, plugins, etc. Some "data-heavy" plugins even have a more "textual" output with working links.

[gaocegege]

When the SVG is loaded as an image the links wouldnt be clickable anyway

Thanks for your reply!

Yeah, markdown can help me with it. But I saw that there is no easy way to support all plugins in markdown. I have to write ejs for it.

[jayvdb]

What about PNG + imagemaps, or emitting HTML into the README.md file? I am guessing that would be a lot simpler than trying to get Markdown working, especially as the HTML could include inline SVG?

Also why does the PNG output type not support animation? Is https://en.wikipedia.org/wiki/APNG not supported by GitHub?

[jayvdb]

I tried config_output: insights which generates https://github.com/jayvdb/jayvdb/blob/main/github-metrics.html , and the GitHub HTML rendering says "(Sorry about that, but we can’t show files that are this big right now.)" , so I it looks like emitting HTML could be a problem. It would be interesting to see if the 'base' only HTML is larger than GitHub will render, as that would suffice for a lot of people.

[lowlighter]

What about PNG + imagemaps, or emitting HTML into the README.md file? I am guessing that would be a lot simpler than trying to get Markdown working, especially as the HTML could include inline SVG?

I have not tested PNG + imagemaps, but not sure whether these are supported by GitHub flavored markdown, since supported tags/attributes are quite restrictive. Direct inclusion of <svg> is disallowed AFAIK. Usually, any tag and feature that could let users inject stuff and be exploited has been disabled by GitHub for security

The way to do it currently is to use the markdown template instead, which have access to all gathered data and can embed plugins and generate links (style may be less pretty, but it's definitely more functional).

Also why does the PNG output type not support animation? Is https://en.wikipedia.org/wiki/APNG not supported by GitHub?

The PNG output is just a puppeteer screenshot so that's why it's static.

I don't know if png output is a popular settings and if APNG is supported by GitHub, but if it does and someone is motivated enough to implement this, it could be eventually added.

I tried config_output: insights which generates https://github.com/jayvdb/jayvdb/blob/main/github-metrics.html , and the GitHub HTML rendering says "(Sorry about that, but we can’t show files that are this big right now.)" , so I it looks like emitting HTML could be a problem

This feature is quite recent and was designed to give the same output as Metrics insights (e.g. https://metrics.lecoq.io/about/torvalds) which is a quick way to have an overview of any GitHub user (which is also why it's not configurable)

It would be interesting to see if the 'base' only HTML is larger than GitHub will render, as that would suffice for a lot of people.

It's probably possible to experiment something like this. You could use the markdown template and actually put HTML similar to base plugin into it (e.g. markdown: TEMPLATE.html) and force the output extension (e.g. filename: output.html)