Rendre HTML à une image

Question

Existe-t-il un moyen de rendre html à l'image comme PNG ? Je sais que c'est possible avec canvas mais je voudrais rendre un élément html standard comme div par exemple.

Answer 1

Oui. HTML2Canvas existe pour rendre le HTML sur <canvas> (que vous pouvez ensuite utiliser comme image).

NOTE : Il y a un problème connu, que cela ne fonctionnera pas avec SVG

Answer 2

Puis-je recommander la bibliothèque dom-to-image, qui a été écrite uniquement pour résoudre ce problème (je suis le mainteneur).
Voici comment vous l'utilisez (certains plus ici) :

var node = document.getElementById('my-node');

domtoimage.toPng(node)
    .then (function (dataUrl) {
        var img = new Image();
        img.src = dataUrl;
        document.appendChild(img);
    })
    .catch(function (error) {
        console.error('oops, something went wrong!', error);
    });