Zoom SVG images on iBooks

Question

not able to zoom SVG images in iBooks for iPad (epub3.0 fixed layout) when using rect or circle:

<svg version="1.1" viewBox="0 0 2048 2048" preserveAspectRatio="xMidYMid meet">
 <g id="viewport" transform="translate(200,200)">
 <g style="fill: #ffffff; stroke:#000000">
 <rect width="2048" height="2048" style="fill:green; stroke:black" />
 <circle  cx="1024" cy="1024" r="1024" style="fill:black; stroke:black" />
 <!--path d="M 0 0 H 2048 V 2048 H 0 Z"/-->
 </g>
 </g>
</svg>

Image is zoomable when using path:

<svg version="1.1" viewBox="0 0 2048 2048" preserveAspectRatio="xMidYMid meet">
<g id="viewport" transform="translate(200,200)">
<g style="fill: #ffffff; stroke:#000000">
<!--rect width="2048" height="2048" style="fill:green; stroke:black" /-->
<!--circle  cx="1024" cy="1024" r="1024" style="fill:black; stroke:black" /-->
<path d="M 0 0 H 2048 V 2048 H 0 Z"/>
</g>
</g>
</svg>

Any idea?

Thanks

Answer 1

Well, I don't have a solution, but I have similar/identical behavior.

• I have four SVG images in an ePub3.0 that passes all ePubcheck, loads fine on the Mac using iBooks, and synchs to an iPad fine using iTunes, and displays fine on the iPad
• Three of the SVG images also zoom fine on both Mac and iPad (click on the image to zoom it)
• One of the SVG images sort of blows up on the Mac. You only see the lower left portion of it.
• The same problem SVG image won't zoom at all on the iPad. The iPad simply skips to the next page
• The problem SVG image does NOT have any rect or circle elements. It is all paths. However, it is more complicated, especially since I turned all text into paths to sidestep the !@$$ fonts problems.
• All four images are drawn in Inkscape, saved as "Plain SVG" and then edited with a text editor to remove the metadata element that ePub/Kindle does not seem to like.

Like you, I am scratching my head. I am about to throw in the towel and simply render everything as large PNGs.