Rendering problem with transparency layer
Look at the following SVG document:
<svg id="glyph3" viewBox="0 0 1000 1000" xmlns="http://www.w3.org/2000/svg">
<rect x="100" y="100" width="800" height="800" fill="blue" />
<g opacity=".8">
<rect x="100" y="100" width="800" height="800" fill="none" stroke="red" stroke-width="100"/>
</g>
</svg>
It renders as following, which is totally correct.
If we change the viewBox and make it the following, the result will be an empty canvas, obviously.
<svg id="glyph3" viewBox="0 1000 1000 1000" xmlns="http://www.w3.org/2000/svg">
<rect x="100" y="100" width="800" height="800" fill="blue" />
<g opacity=".8">
<rect x="100" y="100" width="800" height="800" fill="none" stroke="red" stroke-width="100"/>
</g>
</svg>
However, right before I pass the cairo_t
context to librsvg for rendering, I call cairo_translate(cr, 0, 1000)
to balance
the effect of the ViewBox. This should ideally give the same rendering as shown in the first image above. However, it gives the following. The transparency layer is completely wiped out.
If I change the ViewBox to as shown below and accordingly change the translate call to cairo_translate(cr, 0, 500)
, I get the rendering shown below.
<svg id="glyph3" viewBox="0 500 1000 1000" xmlns="http://www.w3.org/2000/svg">
<rect x="100" y="100" width="800" height="800" fill="blue" />
<g opacity=".8">
<rect x="100" y="100" width="800" height="800" fill="none" stroke="red" stroke-width="100"/>
</g>
</svg>
Operating system is Ubuntu 20.04 and Librvg version is 2.48.9. The rendering is done by calling rsvg_handle_render_cairo
.
I'm sorry if the issue is a duplicate, I tried finding a duplicate but couldn't find any. I think there's a chance the problem comes from Cairo. One may also wonder why set such a viewBox and then add an opposite transform, that seems pointless, right? Actually NotoColorEmojiSVG has such glyphs and I've to set an opposite transform in order to get the glyph rendered properly, but then I see this problem with transparency layers.