Generates the html to image - But only the screen which we are viewing

[vikash09]

It's working fine but, It's unable to generate the image of scrolling div, Only generates the part which is visible, the other part of scrollable div get cut.

[j3ko]

I have this same issue, @vikash09 did you find a solution for this?

[Kasun002]

im also facing same issue

[vivcat[bot]]

Hiya! This issue has gone quiet. Spooky quiet. 👻 We get a lot of issues, so we currently close issues after 60 days of inactivity. It’s been at least 20 days since the last update here. If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not-stale" to keep this issue open! As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request.

Thanks for being a part of the Antv community! 💪💯

[vivcat[bot]]

Hey again! It’s been 60 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it. Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to comment on this issue or create a new one if you need anything else. As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Thanks again for being part of the Antv community! 💪💯

[Sher-V]

same issue

[mvinoba]

Any workarounds for this issue?

[chlumpchatkupt]

My workaround is essentially the following:

1. Resize the container div (e.g., set: height: 1600px !important; width: 1600px !important;) to prevent any overflow or scrolling. In my case, I do this by adding a special css class that targets the appropriate containers and adds max-height: 100% !important'; and display: inline-block !important;.
2. Generate the image.
3. Resize the container div back to the original size (e.g., by removing the special css class, etc.).

[venkateshpullaganti]

Anyone who are looking for

• Fix the issue without resizing / can't resize
• Still persist the nested scrolling

We can do below things if the UI is light weight

• Render complete component in a container with height & width as 0 and overflow:auto.
• All the children containers overflow visible

htmltoimage.toPng(node, { width: node.scrollWidth, height: node.scrollHeight }).then(()=>{})

rendering the wanted image in a container with invisible height and width. Download with its scrollheight and scrollwidth.

[vivcat[bot]]

This thread has been automatically locked because it has not had recent activity. Please open a new issue for related bugs and link to relevant comments in this thread.