Log in / Register

Forum › Bugs

SVG viewBox Directive Ignored in HTML mode

spacetc62
Using the follow code:
<html>
<body>
<svg viewBox="0 0 250 150" 
        width="10cm" height="6cm">
 <g fill="none" stroke="gray" stroke-width="20">
  <rect x="50" y="50" width="400" height="200" 
        rx="80" ry="50"/>
 </g>
</svg>
</body>
</html>


If I run
prince --input xml rect.html

I get the correct output, which is just the upper left 25% of the rectangle.

However, if I run:
prince --input html rect.html

I get the entire rectangle instead of just the corner - it seems to ignore the viewBox height/width.

In general, using html mode work with svg just fine (even though it outputs warnings about "tag svg invalid" etc...). I need to use html mode because it is a lot more forgiving about the input (as opposed to xml mode which fails with any errors in the input - and my input is often quite dirty).

Any suggestions, or a workaround?
mikeday
This is due to an unfortunate side-effect of the current HTML parser, where all attribute names are lowercased. This works well for HTML attributes, which often come in a variety of spellings out on the web (eg. bgcolor, BGCOLOR, bgColor, are all normalised to "bgcolor") but causes problems for case-sensitive XML vocabularies like SVG. For now, the only solution is to use XML, or move the SVG content to an external file and link to it with <img> or <object>.
spacetc62
Hmm, that is unfortunate. Any chance that this will work correctly in the next version of Prince?
mikeday
We are not changing the HTML parser in the next release, but I can think of a JavaScript hack that might do the job. So there is still hope for inline SVG in HTML documents. :)
joelmeador
Can you give some hints as to what that js hack might be? Is it going to be dependent on princexml having js support?
mikeday
Yes: find the "viewbox" attribute and rename it "viewBox", undoing the case normalisation performed by the parser. :)