Hi,

Since the new version Chartdirector (which we use to draw the charts in our reports) has the ability to output SVG files I wanted to try this. But while trying this I found some issues with the rendering of svg's in prince ..

If I try to use the following (generated) svg file in prince

http://eric.nitrate.nl/prince/test_svg.svg

I get this:

http://eric.nitrate.nl/prince/test_svg.pdf

As you can see the chart looks fine but the text doesn't. It is supposed to be verdana (which is most certainly available on my systems, since we use it everywhere in the reports) but it looks like a different font.
Also the allignment is way off (it looks good in both firefox and inkscape).

The generated pdf is from prince 6, but the beta of prince 7 looks excatly the same.

Is this a prince bug? Or is there something in the svg what is not supported by prince? (I don't get any warnings on the commandline)

Kind regards,

Eric de Ruiter
Amplixs Interaction Management

It seems that Prince is not applying the shorthand "font" property on the <tspan> elements, so the font-family="Arial" on the ancestor is being used instead. This is a Prince bug that we will fix for the full release of Prince 7.0. Thanks for reporting the issue!

After some more testing I found some more things:

1) Shorthand font definitions doesn't seem to be supported

As you already mentioned .. tnx for the quick reply!

2) fill-opacity is not supported on a use tag

This doesn't work:

<path id='b1155' fill='#ff3838' stroke-linecap='butt' d='M51,287 L51,198.5 L780,198.5 L780,287 L51,287 Z'/>
<use xlink:href="#b1155" fill-opacity='0.6275'/>

And this does work:

<path id='b1155' fill='#ff3838' fill-opacity='0.6275' stroke-linecap='butt' d='M51,287 L51,198.5 L780,198.5 L780,287 L51,287 Z' />

3) fill-opacity gives wrong colors + affects other colors

When using fill-opacity directly on a path it seems to work, but the colors look different than in inkscape/firefox:

svg: http://eric.nitrate.nl/prince/all_opacity.svg
pdf: http://eric.nitrate.nl/prince/all_opacity.pdf

After some more tests I found more weird stuff .. specifying opacity on one path leads to color of the other path changings:

svg:

http://eric.nitrate.nl/prince/no_opacity.svg
http://eric.nitrate.nl/prince/red_opacity.svg
http://eric.nitrate.nl/prince/orange_opacity.svg
http://eric.nitrate.nl/prince/red_orange_opacity.svg
http://eric.nitrate.nl/prince/all_opacity.svg

pdf:

http://eric.nitrate.nl/prince/no_opacity.pdf
http://eric.nitrate.nl/prince/red_opacity.pdf
http://eric.nitrate.nl/prince/orange_opacity.pdf
http://eric.nitrate.nl/prince/red_orange_opacity.pdf
http://eric.nitrate.nl/prince/all_opacity.pdf

4) text is not aligned properly

If you look at the 10.0 at the Y-Axis in all the previous test cases the 10 is aligned more to the left than it should be. Also all text of the Y-Axis is shifted to the left (it should have been more close to the axis, as shown by firefox which renders them correctly). The same goes for the X-Axis, there the text is shifted to the bottom.

A test case combining all of the above problems:
http://eric.nitrate.nl/prince/original.svg
http://eric.nitrate.nl/prince/original.pdf

Thanks for the detailed report and examples! We will do our best to resolve these issues for the next release.

Quick comment about the (4) text issue: it doesn't seem to be a bug, but just a consequence of the way the SVG is laid out. The text has a starting point on the left, so the right alignment is not guaranteed and depends on the font metrics. A more reliable solution would be to use text alignment to right align the text to a specified point, that would guarantee that all the text lines up and looks identical regardless of font metrics.

We've now released Prince 7.0, which supports the "font", "font-stretch", and "font-variant" properties in SVG and fixes the problem affecting inheritance of fill-opacity on <use> tags.