Forum Feature requests

Data URI SVG as a CSS background image

Until now, I had no problem using base64-encoded png/jpg images in css background-image using data-uri scheme, like this:

background-image: url('data:image/png;base64,iVBORw0KGgoAAAANS...ggg==');

However I was not able to make this work with an unencoded svg image, for example:

background-image: url('data:image/svg+xml;utf8,<svg width="640" height="480" xmlns=""> <g> <text style="cursor: text;" stroke="red" transform="rotate(-45 325.371 238.07) matrix(0.980392 0 0 0.980392 3.2549 5.13725)" font-weight="bold" text-anchor="middle" font-family="Sans-serif" font-size="63" id="svg_1" y="259.280002" x="328.180001" stroke-width="0" fill="red">TEST</text> </g></svg>'); 

It seems to me like it's a missing feature that could be added to Prince quite easily, as data-uri for base64-encoded images and svg backgrounds are already implemented.
Actually, we do support this already! But it seems that there is a bug, where whitespace characters are being stripped from the data URL. If you replace the space characters with %20, then it will work. We will fix this bug in the next release of Prince, thanks for letting us know. :)
Indeed, escaping spaces made it work. However, I needed to encode all non-ascii characters as well (for example É -> %C3%89).

Here's the code that works for me, in case if anyone needs it. I use it to "watermark" all pages:

background-image: url('data:image/svg+xml;utf8,<svg%20width="170mm"%20height="170mm"%20xmlns=""><g><text%20transform="rotate(-45%20324.7626037597656,238.86323547363284)"%20font-weight="bold"%20text-anchor="middle"%20font-family="Sans-serif"%20font-size="63"%20y="259.28"%20x="328.18"%20%20fill="%23DDD">%C3%89PREUVE DE TEST</text></g></svg>');
Today we have released Prince 8.1 rev 5, which correctly supports whitespace in data URLs that have not been Base64 encoded. Thanks again for letting us know about the issue. :)
Lfiszer, I tried your solution with background-image, but I couldn’t manage to make it work on Prince 8.1 rev 5. Could you provide me with a simple HTML file that works for you? Thank you in advance.

Edited by nico