0

I'm making an application that renders a collage of images and then allows the user to download the collage. The PHP portion is contained within an html div whose id = 'chart'. My problem is that I'm unable to download the div contents. I tried using the html2canvas library and all I get is a white block printed on the screen. I'm using Chrome if that helps.

Here is the function that is called when the user clicks the Save Image button:

    function saveimg()
    {
        html2canvas(document.querySelector("#chart")).then(canvas => {
            document.body.appendChild(canvas)
        });
    }

Here are the actual div contents:

div content

Douglas Northwell
  • 35
  • 5
  • If it is all images why aren't you just putting the images in the canvas directly, ie using [drawImage](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/drawImage), and using canvas' saveAs* functions? Or are they cross-domain images which would prevent that, and I believe html2canvas to work? – Patrick Evans Apr 09 '18 at 06:38
  • I'm rendering the images as input type=image because they need to be clickable. I'm doing so with a PHP class since the collage size is customizable. It's also a lot easier to manage the images as elements than having to place them on plot points using the canvas. – Douglas Northwell Apr 09 '18 at 06:49

0 Answers0