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

Go Back   MobileRead Forums > E-Book Software > Sigil

Notices

Reply
 
Thread Tools Search this Thread
Old 05-25-2016, 10:42 AM   #1
dbb1480
Junior Member
dbb1480 began at the beginning.
 
Posts: 6
Karma: 10
Join Date: May 2016
Device: Kindle Paperwhite
adding text after svg (not caption) on single page

Hi all,

I am trying to put together an illustrated book. I want to place a svg of the image on the page then add text after the image and have this all be on the same page.

It keeps splitting this into two pages even though there is clearly enough space for both the image and text on the epub page.

Code:
<body>
  <div style="text-align: center; padding: 0pt; margin: 0pt; page-break-inside:avoid">
    <svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMin meet" version="1.1" viewBox="0 0 955 930" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink"><image height="930" width="955" x="0" xlink:href="../Images/Image00001.jpg" y="0" /></svg>

    <p>Here is some text</p>
    
  </div>
</body>
Anyone have any ideas on how to fix this?
dbb1480 is offline   Reply With Quote
Old 05-25-2016, 10:49 AM   #2
KevinH
Sigil Developer
KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.
 
Posts: 6,495
Karma: 4500132
Join Date: Nov 2009
Device: many
Have you tried changing the height="100%" or changing the height of the viewbox?
KevinH is online now   Reply With Quote
Advert
Old 05-25-2016, 11:07 AM   #3
DiapDealer
Grand Sorcerer
DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.DiapDealer ought to be getting tired of karma fortunes by now.
 
DiapDealer's Avatar
 
Posts: 25,738
Karma: 178231410
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
I don't think it really matters if the text you want included is actually a caption or not. Your best bet, I think, is going to be using the various techniques for keeping captions with their svg images. Most involve two svg wrappers in a containing div (with css suggesting no inside breaks), or just one svg wrapper containing an <image> tag and a <text> tag. Regardless of the technique you use, you should know that there is no fool-proof method that will work across all apps/devices. Keeping text on the same page as an image is simply hit or miss in a reflowable epub using today's standards and toys.

But yes ... Kevin's suggestion of reducing the image's height from something other than 100% will help greatly.
DiapDealer is offline   Reply With Quote
Old 05-25-2016, 11:11 AM   #4
dbb1480
Junior Member
dbb1480 began at the beginning.
 
Posts: 6
Karma: 10
Join Date: May 2016
Device: Kindle Paperwhite
Hi Kevin and DiapDealer,

You are both right, reducing the 100% made a huge difference! I think i really just need to play with optimal image size in order to get it to format correctly.

Thank You Both!
dbb1480 is offline   Reply With Quote
Old 05-26-2016, 05:52 PM   #5
RbnJrg
Wizard
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 1,401
Karma: 5625801
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by dbb1480 View Post
Hi all,

I am trying to put together an illustrated book. I want to place a svg of the image on the page then add text after the image and have this all be on the same page.

It keeps splitting this into two pages even though there is clearly enough space for both the image and text on the epub page.

Code:
<body>
  <div style="text-align: center; padding: 0pt; margin: 0pt; page-break-inside:avoid">
    <svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMin meet" version="1.1" viewBox="0 0 955 930" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink"><image height="930" width="955" x="0" xlink:href="../Images/Image00001.jpg" y="0" /></svg>

    <p>Here is some text</p>
    
  </div>
</body>
Anyone have any ideas on how to fix this?
Read this post:

https://www.mobileread.com/forums/sho...04&postcount=7
RbnJrg is offline   Reply With Quote
Advert
Old 06-10-2016, 11:51 AM   #6
jcsalomon
Connoisseur
jcsalomon can extract oil from cheesejcsalomon can extract oil from cheesejcsalomon can extract oil from cheesejcsalomon can extract oil from cheesejcsalomon can extract oil from cheesejcsalomon can extract oil from cheesejcsalomon can extract oil from cheesejcsalomon can extract oil from cheesejcsalomon can extract oil from cheese
 
jcsalomon's Avatar
 
Posts: 98
Karma: 1204
Join Date: Jun 2012
Device: Bookari (née Mantano Reader) on Android; Kindle Fire HD
I’ve just encountered a similar issue, where Kindles—but not any EPUB reader I tested—insisted on breaking the page before & after the SVG wrapper, even when I’d removed height="100%"; see “SVG wrapper image occupies entire page, and shouldn’t”. Taking the advice here, I put the entire title page in a single SVG block, but I do wish I knew what was causing the problem.
jcsalomon is offline   Reply With Quote
Old 06-10-2016, 12:48 PM   #7
KevinH
Sigil Developer
KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.KevinH ought to be getting tired of karma fortunes by now.
 
Posts: 6,495
Karma: 4500132
Join Date: Nov 2009
Device: many
That makes sense. If you look at KindleUnpack debug output run an azw3 (KF8) that uses an svg with image inside an xhtml file, you will see that Amazon has pulled out the svg into its own section. It always does this. This creates an artificial page break. The KindleUnpack code has to find the extracted svg and put it back inside the xhtml file when trying to unpack to epub from an azw3.
KevinH is online now   Reply With Quote
Old 06-11-2016, 05:00 AM   #8
Hitch
Bookmaker & Cat Slave
Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.
 
Hitch's Avatar
 
Posts: 10,347
Karma: 144858027
Join Date: Apr 2010
Location: Phoenix, AZ
Device: K2, iPad, KFire, PPW, Voyage, NookColor. 2 Droid, Oasis, Boox Note2
Quote:
Originally Posted by KevinH View Post
That makes sense. If you look at KindleUnpack debug output run an azw3 (KF8) that uses an svg with image inside an xhtml file, you will see that Amazon has pulled out the svg into its own section. It always does this. This creates an artificial page break. The KindleUnpack code has to find the extracted svg and put it back inside the xhtml file when trying to unpack to epub from an azw3.
Our experiments--not in the depth of Kevin's, of course--indicate that this is right, also--always breaks after an SVG. It's sort of put us off using SVG for interior graphics for KF8 books. Bummer.

Why we were looking at it:

Spoiler:
We've had a BIZARRE graphic issue this past week, with screenshots from a specific website just degrading dreadfully in MOBI/KF8/7. It's befuddling all of us. It's not the image--works fine in ADE, of all things, iBooks, etc. We suspect that something is going amiss with the KDP compression settings, maybe. We've tried re-taking the screenshots, reprocessing them, using everything from JPG to GIF to PNG to PNG8 to...blabbety, hell, even tried TIFF, changing the compression settings, and NOTHING is working. Thus, we really wanted to think about SVG, but...not with the page-breaking issue.


Hitch
Hitch is offline   Reply With Quote
Reply

Tags
sigil, single page, svg

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Multiple JPG images in SVG on single epub page dbb1480 Sigil 7 05-20-2016 09:57 AM
Svg wrapper with a caption text field roger64 ePub 13 01-31-2016 06:45 PM
join (image + caption) and fill page AlanHK ePub 4 04-04-2015 05:23 PM
Need Example SVG wrapper including caption GrannyGrump ePub 30 11-06-2013 03:20 AM
How can I convert topaz ebook from multiple xhtml's (SVG) to single pdf? rglk Workshop 3 11-28-2011 04:33 PM


All times are GMT -4. The time now is 12:42 PM.


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