0

Here is my JS

<script src="<?= base_url('assets/backend/js/html2canvas.js')?>"></script>

<script>
    function doCapture()
    {
        html2canvas(document.getElementById("certificate2img")).then(function(canvas){
            console.log(canvas.toDataURL("image/jpeg", 0.9));
        });
    }
</script>

Here is my HTML

<div id="certificate2img">
    <div>
        <img src="img.jpg">
    </div>

    <div>
        <P>HELLO WORLD</P>
    </div>

    <div>
        <P>THANKS</P>
    </div>
</div>

<button onclick="doCapture();">Capture</button>

I wanted to have this full div as image, but i am getting it as image without the 'img' from its child

Asibul Islam Asib
  • 1
  • 1
    Does this answer your question? [html2canvas not capturing image](https://stackoverflow.com/questions/27754544/html2canvas-not-capturing-image) – Lars Flieger Feb 01 '21 at 09:19
  • 1
    You can read more about it here: - https://stackoverflow.com/questions/31509227/html2canvas-not-rendering-cdn-images - https://stackoverflow.com/questions/30372417/html2canvas-not-rendering-image-externally-hosted-images Simplest way to solve the issue is to use an image on the same server. – Lars Flieger Feb 01 '21 at 09:20
  • Are you seeing errors in your browser's dev tools console? Most likely is cross origin problem. Depending on your image's source these can sometimes be solved by allowing cross origin in html2canvas options see [link]http://html2canvas.hertzen.com/configuration/#:~:text=Explore%20the%20different%20configuration%20options%20available%20for%20html2canvas,rendering%20i%20...%20%2016%20more%20rows – A Haworth Feb 01 '21 at 16:06

0 Answers0