search

bubkoo / html-to-image

✂️ Generates an image from a DOM node using HTML5 canvas and SVG.
MIT License
5.4k stars 505 forks source link

html-to-image returns a blank screenshot, for the chart antd-desgin #383

Open AdrianEasyOze opened 1 year ago

AdrianEasyOze commented 1 year ago

html-to-image returns a blank screenshot, for the chart antd-desgin the function is as follows

  const takeScreenshot = async (node: HTMLDivElement) => {
    const dataUrl = await htmlToImage.toPng(node, {
      skipFonts: true,

    });

    return dataUrl.split(",")[1];
  };

node sctructure : 

<div class="css-uim5lv-SilentScreenShot elv6jp0j4">
<div style="height: inherit;" data-chart-source-type="G2Plot" size-sensor-id="1">
<div style="position:relative;">
<canvas width="1636" height="892" style="width: 818px; height: 446px; display: inline-block; vertical-align: middle;"> 
</div>
</div> 
</div>

Expected Behavior

the correct screenshot is returned

Current Behavior

an empty screenshot is returned

vivcat[bot] commented 1 year ago

👋 @AdrianEasyOze

Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. To help make it easier for us to investigate your issue, please follow the contributing guidelines.

We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.