Images cannot float #353
Comments
|
Floating images in PDF is extremely difficult, which is why we haven't done it yet. I do have a prototype of some text around images that can be found in editions (https://github.com/opendevise/editions/blob/master/lib/editions/pdf_extensions.rb#L88-L139). We're still considering how to integrate that into Asciidoctor PDF. |
|
As an alternative, I tried using a table, but there is a lot of empty space at the bottom of the table. Here is my code: [cols="2*"]
|===
|Some +
text
|image:image.jpg[]
|===Is it normal that there is a big white space at the bottom of the table? It seems to happen only when using an image inside a table. Thanks for your help. |
That definitely sounds like a bug. Images can throw off the cursor if not handled correctly, which could be happening in this case. I'll definitely look into it. |
|
I think the problem is that inline images aren't properly expanding the cell height, which is the reason for #295 as well. |
|
@mojavelinux Is there any possibility I can try your pdf extension with ascidoctor pdf, as our documentation departement would like to have floating images in pdf too. |
|
@atomfrede Yes, by all means. |
|
@atomfrede did you figure out how to try @mojavelinux PDF extension with Asciidoctor PDF? I'd also like to get floating images working |
|
@cocowalla No I didn't had time. We made some changes to the documents, such that floating images are not required anymore at the moment. |
|
In the case "image in a table cell" i have the following effect with images wider than the cell:
|
|
As I've said many times before, what needs to be done to get AsciiDoc table cell content to work is to write a custom table cell implementation for Prawn that recurses back into the converter to handle arbitrary AsciiDoc content. Once that is done, in theory, we get support for all block-level AsciiDoc in a table cell for "free". Until then, trying to render AsciiDoc content in a table cell by cherry picking it is just a huge hack. |
|
So, what about a proper float implementation into PDF? Is it still in the pipe? |
|
Any updates on this issue? |
|
+1 |
|
At this point, I seriously doubt Asciidoctor PDF will ever support floating. It's not just a matter of time. This technology stack (specifically Prawn) just doesn't provide the tools we need to do it without an enormous amount of logic. We're going to be pivoting our PDF strategy to leverage web technologies (HTML and CSS). Once we do that, we'll be able to use all kinds of advanced layouts, including floating. I'll be posting about this new strategy on the list later this week. |
Has this ever been done? A search did not reveal anything really relevant. |
|
I've been waiting on the 1.5.0 release to push out the official announcement. I have been talking about it rather extensively in the gitter channel, though. The prototype can be found at https://github.com/mogztter/asciidoctor-pdf.js, but it's still early days. |
|
Same issue with epub3 renderings, I have no way to position images on the side with some text Example code: So the HTML rendering (asciidoctor) renders very good, like: HTML:
But for PDF or for EPUB3, it always renders it in a strange and unfriendly way (I tried different options for the images, nothing found to work nicely yet): Epub:
PDF:
|
|
Please direct Asciidoctor EPUB3 feature requests to the issue tracker for that project. https://github.com/asciidoctor/asciidoctor-epub3/issues This issue tracker is only for issues that pertain to Asciidoctor PDF. |
This issue was addressed by the fix for #1515. Here's how it looks now when using a table for layout.
It takes some fiddling to get the amount of text right per cell, but at least there is no extra bottom margin now. |
… that supports image float
… that supports image float
… that supports image float
… that supports image float
… that supports image float
…rter - add supports_float_wrapping? to check if the following node supports wrapping around a float - add ink_paragraph_in_float_box to handle logic to render paragraph within float box - move cursor as content is inked in float box - update example to show how to enlist a code block in float wrapping - add additional information to float_box
… that supports image float
…rter - add supports_float_wrapping? to check if the following node supports wrapping around a float - add ink_paragraph_in_float_box to handle logic to render paragraph within float box - move cursor as content is inked in float box - update example to show how to enlist a code block in float wrapping - add additional information to float_box
… that supports image float
…rter - add supports_float_wrapping? to check if the following node supports wrapping around a float - add ink_paragraph_in_float_box to handle logic to render paragraph within float box - move cursor as content is inked in float box - update example to show how to enlist a code block in float wrapping - add additional information to float_box
- add supports_float_wrapping? method to check if the following node supports wrapping around a float - add init_float_box method to set up float box - call init_float_box method in convert image handler if float attribute is set on image and next block supports float wrapping - add ink_paragraph_in_float_box to handle logic to render paragraph within float box - add image-float-gap key to theme to control space around image float - add extended converter example to docs to show how to enlist a code block in float wrapping - add support for :indent_paragraphs option to formatted text box - use image float in chronicles example to demonstrate
- add support for float attribute on block image, taking precedence over align attribute - add supports_float_wrapping? method to check if the following node supports wrapping around a float - add init_float_box method to set up float box - call init_float_box method in convert image handler if float attribute is set on image and next block supports float wrapping - add ink_paragraph_in_float_box to handle logic to render paragraph within float box - add image-float-gap key to theme to control space around image float - add extended converter example to docs to show how to enlist a code block in float wrapping - add support for :indent_paragraphs option to formatted text box - use image float in chronicles example to demonstrate
|
I'm thrilled to report that after all the changes and improvements that were made to the code for the 2.0.0 release, it became possible to implement this feature. The way it works is that it will wrap successive paragraphs next to the floating image (an block image with the float attribute). The float box will be cleared once the content extends past the bottom of the image or another type of block is encountered. However, the code also adds a framework for enlisting additional block types in the float wrapping, which is explained in the documentation. |
|
@mojavelinux Is there a way to use [.float-group] with PDF? I'm traying put three image side by side, and I can do it in HTML, but not in PDF... |
|
Please direct usage questions to the project chat at https://chat.asciidoctor.org. Thanks. |
Hello.
We can have floating image in the HTML5 backend using this syntax:
image::image.jpg[role="right"]but it does not work in the PDF backend.
Thanks to fix this issue.
The text was updated successfully, but these errors were encountered: