tsayen / dom-to-image

Generates an image from a DOM node using HTML5 canvas
Other
10.21k stars 1.68k forks source link

Render image at different browser width and height so media queries can be applied #347

Open blasto333 opened 3 years ago

blasto333 commented 3 years ago

I would like to propose 2 new options windowWidth and windowHeight. This would allow a dom element to be rendered at a certain width and or height. When using css media queries we could force the image to be rendered at a certain browser width. Below is an example of how I see it working.

Is there a way to do this now?


var node = document.getElementById('receipt_wrapper');
domtoimage.toPng(node,{windowWidth:'280px',windowHeight:'auto'})
    .then(function (dataUrl) {
        var img = new Image();
        img.src = dataUrl;
        document.body.appendChild(img);
    })
    .catch(function (error) {
        console.error('oops, something went wrong!', error);
    });