SVG Image inside XHTML document - render to PDF

2,690 views
Skip to first unread message

Alex

unread,
Dec 14, 2011, 2:33:30 PM12/14/11
to Flying Saucer Users
I was trying to render mixed XHTML+SVG content to a PDF document. I
followed the SVG demo application from the sources on github.

The svg image is part of the XHTML document nested inside a <svg> tag.
When running the application the replaced element factory was called
several times for different elements - div, input, button, table,
e.t.c
but it was never called for the svg element. As a result there was no
image generated in the PDF. But inside the SVG there were some texts
that were rendered in the PDF as a single line - all texts one after
another.

On the net there are many examples for rendering XML+CSS, XHTML, HTML
to PDF. There are also examples for rendering SVG to PDF using Apache
batik, but I could not find example / explanation how to render XHTM/
HTML containing embedded SVG image using the HTML5 <svg> tag to PDF
document.

What is the correct way of rendering mixed content XHTM/HTML + SVG to
PDF document?
It is actually possible?

Is it possible to render the XHTML and the SVG in 2 separate documents
and than merge/insert the document that is the rendered SVG into the
"master" document that represents just the XHTM markup without the SVG
image?

Peter Brant

unread,
Dec 15, 2011, 8:02:25 AM12/15/11
to flying-sa...@googlegroups.com
<svg> needs to be a block-level element (for example, display: block
or display: inline-block).

Pete

Patrick Wright

unread,
Dec 15, 2011, 10:32:13 AM12/15/11
to flying-sa...@googlegroups.com
I'm not able to access the code at the moment, but I believe that demo
with SVG generated images using the Java2D image APIs, and the SVG
Salamander library. If I'm not mistaken, you'd need to generate the
PDF-compatible images to use as replaced elements inside PDF output.

Alex GMail

unread,
Dec 15, 2011, 10:36:02 AM12/15/11
to flying-sa...@googlegroups.com
On Thu, 15 Dec 2011 17:32:13 +0200, Patrick Wright <pdou...@gmail.com>
wrote:

> I'm not able to access the code at the moment, but I believe that demo
> with SVG generated images using the Java2D image APIs, and the SVG
> Salamander library. If I'm not mistaken, you'd need to generate the
> PDF-compatible images to use as replaced elements inside PDF output.

Yow are right. I am using Apache batik and SvgToPdf example code from
itext website to generate the PDF data.
My problem was that the replaced element factory was never called for the
<svg> tag.

> On Thu, Dec 15, 2011 at 10:02 AM, Peter Brant <peter...@gmail.com>
> wrote:
>> <svg> needs to be a block-level element (for example, display: block
>> or display: inline-block).
>>
>> Pete
>>

Thanks. This solved my problem :) Now my factory is called and the image
painted inside the PDF document :)

chris

unread,
Feb 10, 2012, 10:05:31 AM2/10/12
to Flying Saucer Users
Hi,
I'm also interested in doing XHTML+SVG to PDF. This discussion shed
some light on the topic, but it is not clear what is the final
solution path. Does flying-saucer handle this (if I make SVG a block
or inline-block) or do I need to run a separate process to turn SVG
into PDF and merge that with the flying-saucer generated PDF? Can
anyone share the details and perhaps a code sample?

Thank you.
Chris


On Dec 15 2011, 10:36 am, "Alex GMail" <alexandre.niko...@gmail.com>
wrote:
> On Thu, 15 Dec 2011 17:32:13 +0200, Patrick Wright <pdoubl...@gmail.com>
> wrote:
>
> > I'm not able to access the code at the moment, but I believe that demo
> > with SVG generated images using the Java2D image APIs, and the SVG
> > Salamander library. If I'm not mistaken, you'd need to generate the
> > PDF-compatible images to use as replaced elements inside PDF output.
>
> Yow are right. I am using Apache batik and SvgToPdf example code from
> itext website to generate the PDF data.
> My problem was that the replaced element factory was never called for the
> <svg> tag.
>
> > On Thu, Dec 15, 2011 at 10:02 AM, Peter Brant <peter.br...@gmail.com>

Amit

unread,
Mar 18, 2014, 9:01:49 AM3/18/14
to flying-sa...@googlegroups.com
Hi Chris,
Are you able to solve this. I am also facing issue to understand the extension. I have followed below example for converting the svg to image and paint in the pdf.
But, in my case, still it is not showing graph. I tried to put some logs inside the extended class, paint method. But, it is not logging.
I also found that inside my custom ReplcedElementFactory the document object is null.


Any clue how to solve this?

Thanks,
Amit

mat

unread,
Mar 22, 2014, 2:18:34 PM3/22/14
to flying-sa...@googlegroups.com
Am Dienstag, 18. März 2014 14:01:49 UTC+1 schrieb Amit:


Any clue how to solve this?

Thanks,
Amit

Hi Amit

I am writing a small wrapper around flying-saucer that calls batik for rendering a SVG if the image source ends with ".svg". This is not published software yet. But you may consult the source code, maybe this gives you an idea how it can be done. Make sure the image has defined "width" and "height" CSS-properties and that "display: block". See https://m4t.ch/fossil-repos/csspdf. When writing the wrapper I also consulted the link from www.samuelrossille.com.

Rajasekhar B

unread,
Jun 30, 2014, 3:33:35 AM6/30/14
to flying-sa...@googlegroups.com
Hi Alex, I am struggling to do the same conversion. Can you help me to find the links or sources of examples? Thanks in advance.
Reply all
Reply to author
Forward
0 new messages