Skip to content

Optionally embed SVG as data URI instead of inlining? #9787

Closed
@allefeld

Description

@allefeld

When an SVG file is embedded in HTML output with --embed-resources, Pandoc inlines the SVG code into the HTML code. This differs from the behavior for other image file types, which are embedded by setting the img src attribute to a data URI. This special behavior makes sense, because the data URI unnecessarily obfuscates things.

However, it has the unfortunate side effect that the SVG image can no longer be easily saved to a file or opened in a separate tab from a browser. I.e. right-clicking on the image opens a context menu which lacks the entries "Open image in new tab", "Save image as..." etc. (tested in Brave, Chromium, and Firefox on Linux).

Example HTML to demonstrate the difference:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">
<body>

<p><svg id="svg4" role="img" width="300" height="130" xmlns:svg="http://www.w3.org/2000/svg" viewBox="0 0 300 130"><defs id="svg4_defs8"></defs>
  <rect width="200" height="100" x="10" y="10" rx="20" ry="20" fill="blue" id="svg4_rect2" />
</svg></p>

<p><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgd2lkdGg9IjMwMCIKICAgaGVpZ2h0PSIxMzAiCiAgIHZlcnNpb249IjEuMSIKICAgaWQ9InN2ZzQiCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnMKICAgaWQ9ImRlZnM4IiAvPgrCoCA8cmVjdAogICB3aWR0aD0iMjAwIgogICBoZWlnaHQ9IjEwMCIKICAgeD0iMTAiCiAgIHk9IjEwIgogICByeD0iMjAiCiAgIHJ5PSIyMCIKICAgZmlsbD0iYmx1ZSIKICAgaWQ9InJlY3QyIiAvPgo8L3N2Zz4K" /></p>

</body>

The two images look exactly the same, but the first cannot be saved to a file while the second can.

I find it useful for a user to be able to access an image separately from the main document.

Therefore my feature request: Could we have an option to disable the inlining of SVG files (with --embed-resources) such that data URIs are created instead?

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions