title: Java/iText/Flying Saucer: Convert HTML containing svg tags to pdf
body: <p>I'm trying to generate a pdf file in Java from HTML. The HTML code contains a svg tag that was generated by Google Charts API to display a column chart.</p>
  
  <p>I tried to do it with Flying Saucer R8 like so:</p>
  
  <pre><code>  StringBuffer sb = new StringBuffer();
      sb.append("&lt;div id='chartArea'&gt;&lt;svg width='830' height='400'&gt;&lt;defs id='defs'&gt;&lt;clipPath id='_ABSTRACT_RENDERER_ID_0'&gt;&lt;rect x='45' y='77' width='560' height='247'/&gt;&lt;/clipPath&gt;&lt;/defs&gt;&lt;rect x='0' y='0' width='830' height='400' stroke='none' stroke-width='0' fill='#ffffff'/&gt;&lt;g&gt;&lt;rect x='45' y='77' width='560' height='247' stroke='none' stroke-width='0' fill-opacity='0' fill='#ffffff'/&gt;&lt;g clip-path='url(#_ABSTRACT_RENDERER_ID_0)'&gt;&lt;g&gt;&lt;rect x='45' y='323' width='560' height='1' stroke='none' stroke-width='0' fill='#cccccc'/&gt;&lt;rect x='45' y='262' width='560' height='1' stroke='none' stroke-width='0' fill='#cccccc'/&gt;&lt;rect x='45' y='200' width='560' height='1' stroke='none' stroke-width='0' fill='#cccccc'/&gt;&lt;rect x='45' y='139' width='560' height='1' stroke='none' stroke-width='0' fill='#cccccc'/&gt;&lt;rect x='45' y='77' width='560' height='1' stroke='none' stroke-width='0' fill='#cccccc'/&gt;&lt;/g&gt;&lt;g&gt;&lt;rect x='60' y='323.5' width='49' height='0' stroke='none' stroke-width='0' fill='#757575'/&gt;&lt;rect x='140' y='323.5' width='49' height='0' stroke='none' stroke-width='0' fill='#757575'/&gt;&lt;rect x='220' y='323.5' width='49' height='0' stroke='none' stroke-width='0' fill='#757575'/&gt;&lt;rect x='300' y='323.5' width='49' height='0' stroke='none' stroke-width='0' fill='#757575'/&gt;&lt;rect x='380' y='323.5' width='49' height='0' stroke='none' stroke-width='0' fill='#757575'/&gt;&lt;rect x='460' y='323.5' width='49' height='0' stroke='none' stroke-width='0' fill='#757575'/&gt;&lt;rect x='540' y='111' width='49' height='212' stroke='none' stroke-width='0' fill='#757575'/&gt;&lt;/g&gt;&lt;g&gt;&lt;rect x='45' y='323' width='560' height='1' stroke='none' stroke-width='0' fill='#333333'/&gt;&lt;/g&gt;&lt;/g&gt;&lt;g/&gt;&lt;g&gt;&lt;g&gt;&lt;text text-anchor='middle' x='85.42857142857143' y='343.05' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#222222'&gt;2012-04-26&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='middle' x='165.28571428571428' y='360.05' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#222222'&gt;2012-04-27&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='middle' x='245.14285714285717' y='343.05' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#222222'&gt;2012-04-28&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='middle' x='325' y='360.05' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#222222'&gt;2012-04-29&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='middle' x='404.8571428571429' y='343.05' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#222222'&gt;2012-04-30&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='middle' x='484.7142857142857' y='360.05' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#222222'&gt;2012-05-01&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='middle' x='564.5714285714286' y='343.05' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#222222'&gt;2012-05-02&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='end' x='39' y='328.05' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#444444'&gt;0&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='end' x='39' y='266.55' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#444444'&gt;6&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='end' x='39' y='205.05' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#444444'&gt;12&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='end' x='39' y='143.55' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#444444'&gt;18&lt;/text&gt;&lt;/g&gt;&lt;g&gt;&lt;text text-anchor='end' x='39' y='82.05' font-family='Arial' font-size='13' stroke='none' stroke-width='0' fill='#444444'&gt;24&lt;/text&gt;&lt;/g&gt;&lt;/g&gt;&lt;/g&gt;&lt;g&gt;&lt;g&gt;&lt;text text-anchor='middle' x='17.05' y='200.5' font-family='Arial' font-size='13' font-style='italic' transform='rotate(-90 17.05 200.5)' stroke='none' stroke-width='0' fill='#222222'&gt;Amount (USD)&lt;/text&gt;&lt;/g&gt;&lt;/g&gt;&lt;g/&gt;&lt;/svg&gt;&lt;/div&gt;");
  
      Document document = XMLResource.load(new ByteArrayInputStream(sb.toString().getBytes())).getDocument();
      ITextRenderer renderer = new ITextRenderer();
      renderer.setDocument(document,"test");
      String outputFile = "test.pdf";
      OutputStream os = new FileOutputStream(outputFile);
      renderer.layout();
      renderer.createPDF(os);
      os.close();
  </code></pre>
  
  <p>The result is a generated PDF that contains the chart's axis values but not the chart itself; i.e. the chart image was not included.</p>
  
  <p>Any ideas or suggestions will be extremely helpful.</p>
  
  <p>Thanks,
  Shaun</p>