Help! Objects look weird

[User7]

Hello, take a look at the attached image. On the left (InDesign14) the item looks ok and its anchored (source pasted from a .doc file) but on the right the epub looks awful. How can I fix this? Any setting before exporting to reflowable epub I miss?



http://imgur.com/8MI0bAO

[Toxaris]

It depends on your target. If it is ePUB3, you should use MathML. If it is ePUB2 (most supported), equations are best of as images (png or svg). I personally use SVG, since I can make that scale-able to the font size. I use the codecogs site for creating SVG equations.

[User7]

Originally Posted by Toxaris

It depends on your target. If it is ePUB3, you should use MathML. If it is ePUB2 (most supported), equations are best of as images (png or svg). I personally use SVG, since I can make that scale-able to the font size. I use the codecogs site for creating SVG equations.

They are already images and I select Epub 2 before exporting. Any help?

[pdurrant]

Am I right in thinking that the left hand side of the equation is an image, but the ' = 0' part is plain text? In which case, I'd advise doing the entire equation as an (SVG) image.

[User7]

Originally Posted by pdurrant

Am I right in thinking that the left hand side of the equation is an image, but the ' = 0' part is plain text? In which case, I'd advise doing the entire equation as an (SVG) image.

Correct. I'm afraid that is not practical for an entire book and also many times there are equations in text lines.

[Toxaris]

Perhaps not practical, but it is the best solution.

[User7]

Originally Posted by Toxaris

Perhaps not practical, but it is the best solution.

Not for the case where equations appear among text lines, plus its a book with thousands of equations. The thing is that when I export to pdf the equations look as they should which means anchoring is correct. hmmmmm

[Toxaris]

Among text lines is not an issue. You can embed SVG as regular images and even specify the height as e.g. 1 em.

The fact that it are thousand of equations can be hard. However, you already say that you have a Word document. With my add-in you can export the equations in the MathML format. From there it is easy to convert to SVG. For example with http://www.grigoriev.ru/svgmath/. If you keep the name equal with the PNG images that Word normally uses, you should be able to use some smart Search/Replace rules to do a quick replace.

[Hitch]

Originally Posted by User7

Not for the case where equations appear among text lines, plus its a book with thousands of equations. The thing is that when I export to pdf the equations look as they should which means anchoring is correct. hmmmmm

The export to PDF is utterly irrelevant. PDF has support for multi-column objects, which is what you're exporting. You have TWO images, not one, that you are trying to export together, forcing them to keep the same appearance (distance between, etc.) that they have in the Word file. You might be able to get that to work for a single reader, or, say, all the readers using a certain rendering engine--but it's going to fail in most.

Whether or not it's "practical" is also utterly irrelevant. Converting them to PNG or SVG--all together, in a single image--is the only way you're going to get this to work. And be advised, depending on whether or not you have MOBI as a target, as well, that using SVG probably won't work, inline, for the millions of KF7 devices still out there.

This is why books like this are quoted with rather high prices at eBook conversion houses like mine. It's an horrendous amount of manual labor, generally speaking. Toxaris's MathML export is likely your only available "shortcut." And yes, that means that you're going to have to replace the ones in the ePUB output with the SVGs from the Word-->MathML-->PNG-->SVG process. More tedious manual labor.

Hitch

[User7]

Thanx everyone.
For those interested after exporting adding a "vertical-align:middle;" style for each image/equation did the trick

[Hitch]

Originally Posted by User7

Thanx everyone.
For those interested after exporting adding a "vertical-align:middle;" style for each image/equation did the trick

Uh, seriously? Do you mean, that you exported two images, each part of an equation, and using vertical-align:middle, (for what, the image elements, or...?) worked to keep them together? Or did you export Math ML?

This works on ePUB format, you say--what readers did you test it on, and did you try it for MOBI, if you're going that route?

Hitch

[User7]

Originally Posted by Hitch

Uh, seriously? Do you mean, that you exported two images, each part of an equation, and using vertical-align:middle, (for what, the image elements, or...?) worked to keep them together? Or did you export Math ML?

This works on ePUB format, you say--what readers did you test it on, and did you try it for MOBI, if you're going that route?

Hitch

I didn't export any image/equation. After having the material correctly placed on the InDesign document, I exported (ePUB was the format I was assigned to do, never tried others) and added that style to each image. (either on the xhml directly or via CSS) That image (equation) appeared as it should (50% above the text line and 50% below -in the middle of the parent element) I usually try the results on a browser extension and on Adobe Digital Editions.

[Hitch]

Originally Posted by User7

I didn't export any image/equation. After having the material correctly placed on the InDesign document, I exported (ePUB was the format I was assigned to do, never tried others) and added that style to each image. (either on the xhml directly or via CSS) That image (equation) appeared as it should (50% above the text line and 50% below -in the middle of the parent element) I usually try the results on a browser extension and on Adobe Digital Editions.

Hi:

OK, well, if you're viewing this in ADE, it must not be FXL (Fixed-Layout), is that right? Forgive me for asking, but you'd be amazed at how many folks come to use with what are, essentially, fixed-layout ePUBs that they made using INDD, and don't understand what the issues are, when we try to create a reflowable.

What did you use as the parent element? A div? The same div, for each image (equation)? (like a pseudo or ghost container?) Did you affix the line-height, and/or the height of the div? Is this an ePUB3, or 2?

I'm simply a bit surprised that this worked. Actually, more than a bit...

Hitch