Register Guidelines E-Books Search Today's Posts Mark Forums Read

Go Back   MobileRead Forums > E-Book Formats > ePub

Notices

Reply
 
Thread Tools Search this Thread
Old 04-11-2010, 04:14 AM   #1
ninni
Junior Member
ninni began at the beginning.
 
ninni's Avatar
 
Posts: 6
Karma: 10
Join Date: Jan 2010
Location: Helsinki, Finland
Device: Sony
Problems with SVG

Hello!

I've been using linked svg files in my epubs with the object tag, so that i can include fallback images as well.

Everything looks just fine in ADE, Bookworm and FBReader + sony reader prs505. However now I've tested my epubs on the Onyx Boox device and the SVG pictures seem to be "eating up" a few lines of text above the picture.

I'd really apreciate if someone could help me with this, there doesn't seem to be any proper manuals for SVG:s in EPUB, and I'm going mad testing and testing.

The object tag is in the attachment, since I wasn't able to insert the tags here.
Attached Files
File Type: txt ojecttag.txt (126 Bytes, 137 views)

Last edited by Jellby; 06-15-2010 at 10:27 AM. Reason: Fixed the title
ninni is offline   Reply With Quote
Old 04-12-2010, 11:17 AM   #2
frabjous
Wizard
frabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameter
 
frabjous's Avatar
 
Posts: 1,213
Karma: 12890
Join Date: Feb 2009
Location: Amherst, Massachusetts, USA
Device: Sony PRS-505
The problem might be the width="100%" part of the tag, which, if the aspect ratio is being preserved, might stretch the image vertically too, and some renderers might do that upwards.

I recommend putting in the exact width and height, e.g.:

Code:
<object data="images/graafi.svg" type="image/svg+xml" style="width: 100pt; height: 100pt;"> <img src="images/graafi.png" alt="graafi.png" /> </object>
Change "100pt" to whatever the height and width are.

You could also put in "maximum-width: 100%;" if you're worried about it overstretching the screen.

I don't know if that will help.

My own personal experience has been that SVG support is still pretty inconsistent across various renderers--and not just in ePubs, but in web browsers and plug-ins, as well. (Plus, I'm still learning.)
frabjous is offline   Reply With Quote
Old 04-15-2010, 03:56 PM   #3
DaleDe
Grand Sorcerer
DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.DaleDe ought to be getting tired of karma fortunes by now.
 
DaleDe's Avatar
 
Posts: 9,652
Karma: 5071814
Join Date: Aug 2007
Location: Grass Valley, CA
Device: EB 1150, EZ Reader, Literati, iPad 2
Exact widths are not a good solution. How do you know what size device the user is using to read the book?

Dale
DaleDe is offline   Reply With Quote
Old 04-15-2010, 04:48 PM   #4
frabjous
Wizard
frabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameter
 
frabjous's Avatar
 
Posts: 1,213
Karma: 12890
Join Date: Feb 2009
Location: Amherst, Massachusetts, USA
Device: Sony PRS-505
Quote:
Originally Posted by DaleDe View Post
Exact widths are not a good solution. How do you know what size device the user is using to read the book?

Dale
When you set an exact width on an image file, that doesn't mean that the image won't zoom when someone zooms with the device. Indeed, they usually do. It really just sets up the size of the images at "normal settings". Actually, the XML tags inside the SVG itself will have as one of its attributes a nominal exactly height and width. Because it's an SVG, it can be scaled to different sizes, and someone can be encouraged to do this, but it still has a nominal size.

But the issue is really one with SVGs in particular. Support for SVGs is very inconsistent and immature on various reading platforms. For example, Webkit based browsers like Chrome and Safari have a problem with SVGs that don't have an exact height and width specified: it usually makes them take up the wrong among of space, or even puts them inside a little frame with scrollbars on the size even when the image would have fit just fine in context without these. It's just someone I've seen from experience as an issue, so I've always felt it necessary to set the exact size.

But for the moment, I'm mainly advocating it as a first step in diagnosing the problem. If it turned out not to help with ninni's issue, I'd switch back in a heartbeat. I don't really know that much about Onyx's support of SVG.

Last edited by frabjous; 04-15-2010 at 04:51 PM.
frabjous is offline   Reply With Quote
Old 05-07-2010, 02:59 AM   #5
ninni
Junior Member
ninni began at the beginning.
 
ninni's Avatar
 
Posts: 6
Karma: 10
Join Date: Jan 2010
Location: Helsinki, Finland
Device: Sony
Thanks for the advice! I'll try using the exact width instead of a percentual width. Previously I put a pagebreak before the SVG, so that it wouldn't strech over the text, but I don't think it's a very good idea, for instance if I wanted to have a logo in SVG format on the title page. Then the logo should always be the first element on the page, or the whole title page should be an SVG file... It's very annoying though that there seems to be so little support for SVG, since I think it would be ideal for a lot of elements in ebooks.
ninni is offline   Reply With Quote
Old 06-15-2010, 09:20 AM   #6
georg3200
Connoisseur
georg3200 began at the beginning.
 
Posts: 53
Karma: 10
Join Date: Nov 2008
Device: none
I have also massive problems with svg-files. My svg-files do not show at all in the epub, though they show without problems in firefox. In the Epub I see only the fallback-jpgs. I used ninnis code from the objecttag.txt.
I have no problems of embedding svgs to a html-file, but I need wo use around 50 svgs in one html-file. So the 300k maximum filesize would be a problem. Splitting the files is not an option.
All the svg-files will be big tables, so screenshots are not an option too. They would be unreable.

The svg-files where created with Adobe Illustrator CS4.
Might the way I save the SVG be a problem. I have left the preferences when saving SVG in AI CS4.

Does someone has an idea?
georg3200 is offline   Reply With Quote
Old 06-15-2010, 10:10 AM   #7
frabjous
Wizard
frabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameter
 
frabjous's Avatar
 
Posts: 1,213
Karma: 12890
Join Date: Feb 2009
Location: Amherst, Massachusetts, USA
Device: Sony PRS-505
I don't know about Adobe Illustrator, but I know that in Inkscape, it's best to save the SVG as "Plain SVG" rather than "Inkscape SVG" if I want the file to work (well) with other applications.

But what program are you using to check to see if the SVGs are showing in the ePubs? Adobe Digital Editions? Have you checked the (x)html files that call the SVGs inside the ePub in Firefox or just the SVGs? Have you tried any other browsers?
frabjous is offline   Reply With Quote
Old 06-15-2010, 11:25 AM   #8
georg3200
Connoisseur
georg3200 began at the beginning.
 
Posts: 53
Karma: 10
Join Date: Nov 2008
Device: none
When I save the file as an SVG there are a lot of prefs like SVG 1.0 or SVG 1.1 or SVG Tiny 1.1 and so on... There is nothing like "Plain SVG"
Of course it might be, that the options when saving are the problem?!?

I open the SVG itself in InternetExplorer7 and it looked good. Then I use ninnis code (see objecttag.txt above) to reference the SVG in my xhtml-file. I opened the the xhtml-file in Firefox and in InternetExplorer 7 and there was the SVG as expected.
I packed everything into my epub and everything was fine except the SVG. All I could see was the dummy-fallback-image. If I do not use a fallback-image, there is only a lot of white space :-(
georg3200 is offline   Reply With Quote
Old 06-15-2010, 11:46 AM   #9
georg3200
Connoisseur
georg3200 began at the beginning.
 
Posts: 53
Karma: 10
Join Date: Nov 2008
Device: none
problem solved.

it was an error in the opf-file:

I wrote:

Code:
<item href="images/img_02000008.svg" id="image_img_02000008_svg" media-type="image/svg"/>
instead of

Code:
<item href="images/img_02000008.svg" id="image_img_02000008_svg" media-type="image/svg+xml"/>
so it was just a littlle error in the media-type.

Now the SVG shows in the epub. but it seems that it makes the epub damm' slow
georg3200 is offline   Reply With Quote
Old 06-15-2010, 01:10 PM   #10
frabjous
Wizard
frabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameter
 
frabjous's Avatar
 
Posts: 1,213
Karma: 12890
Join Date: Feb 2009
Location: Amherst, Massachusetts, USA
Device: Sony PRS-505
I'd save it either as SVG 1.0 or SVG 1.1 for maximum compatibility.

But how are you opening it in IE7? As far as I know, IE7 cannot open SVGs without a plugin.
frabjous is offline   Reply With Quote
Old 06-18-2010, 04:20 AM   #11
georg3200
Connoisseur
georg3200 began at the beginning.
 
Posts: 53
Karma: 10
Join Date: Nov 2008
Device: none
I'm not sure why I can open SVGs in Internet Explorer 7. There is a plug-in "SVG Document" installed. Maybe that's the trick.
georg3200 is offline   Reply With Quote
Old 06-18-2010, 11:58 AM   #12
frabjous
Wizard
frabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameterfrabjous can solve quadratic equations while standing on his or her head reciting poetry in iambic pentameter
 
frabjous's Avatar
 
Posts: 1,213
Karma: 12890
Join Date: Feb 2009
Location: Amherst, Massachusetts, USA
Device: Sony PRS-505
Yep, that's why. I think Internet Explorer 9 will be able to view them without a plug in (like all other web-browsers do).
frabjous is offline   Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Examples of ePubs with SVG? wallcraft ePub 10 12-09-2011 01:21 PM
SVG Compatible Readers? nboshart ePub 2 09-22-2010 12:12 AM
Kindle and SVG? Tom Wood News 1 09-03-2010 08:06 PM
Help with Merge Records - an SVG icon Starson17 Calibre 3 03-26-2010 01:20 PM
gets SVG when should be JPG JSWolf Calibre 2 04-21-2009 03:35 PM


All times are GMT -4. The time now is 08:37 AM.


MobileRead.com is a privately owned, operated and funded community.