SVG Self-contained fix insufficient in #9420

[PeterSommerlad]

replaced ids are not replaced for gradients:

<path d="M 0,0 H 100 V 100 H 0 Z" style="fill:url(#radialGradient46);stroke:none" id="svg2_path48" />

should be

<path d="M 0,0 H 100 V 100 H 0 Z" style="fill:url(#svg2_radialGradient46);stroke:none" id="svg2_path48" />

See my comment on #9420 as well.

It seems this fix (#9420) was insufficient to support gradients in SVG. While clipping now works, Gradient areas are shown black in Safari denoting a problem. I'll attach a small example and experiments that I did. to demonstrate the missing things

• A markdown file with tikz image using the filter diagram.lua Test.md
• the output produced from pandoc as html using pandoc -s -t html --embed-resources --standalone -L diagram.lua -o Test.html Test.md
• The intermediate pdf produced by diagram.lua that I hacked to keep it around: TestImage.pdf
• The SVG file produced by inkscape --export-plain-svg --export-filename=./TesDirectInkscape.svg ./TestImage.pdf
• And a html file, where I copied the SVG file of the previous step into the above Test.html where one sees that the browser now renders both correctly, so it is definitely an issue with some ids not transformed correctly by pandoc: TestBothPandocAndInkscapeSVGRendercorrectlyTogehter.html

It took me about a week to find the culprit (it worked with earlier versions somehow) and the clipping was fixed by above changes but they were insufficient for gradient shadings.

• Test.md
• Test.html.txt
• TestImage.pdf
• TestDirectInkscapeConversion
• TestBothPandocAndInkscapeSVGRendercorrectlyTogehter.html.txt

Pandoc version?

pandoc 3.1.12
Features: +server +lua
Scripting engine: Lua 5.4

[jgm]

I've got a more general fix.