daffaa08 / jzebra

Automatically exported from code.google.com/p/jzebra
0 stars 0 forks source link

html2canvas squishes image #200

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago
Some times when using HTML5 canvas to print, the image is squished or distorted.

This is caused by the default behavior of html2canvas to use the dimensions of 
the browser window.

To override this default behavior, two additional parameters must be provided 
to html2canvas:

i.e.:

>  width: 400,
>  height: 200

A full snippet of code may look like this:

    function printHTML5Div() {
        $("#content").html2canvas({ 
            canvas: hidden_screenshot,
            onrendered: function() {
                if (notReady()) { return; }
                qz.appendImage($("canvas")[0].toDataURL('image/png'));
                // Automatically gets called when "qz.appendFile()" is finished.
                window['qzDoneAppending'] = function() {
                    // Tell the applet to print.
                    qz.printPS();

                    // Remove reference to this function
                    window['qzDoneAppending'] = null;
                };
            },
            width: 324,
            height: 200
        });
    }

Original issue reported on code.google.com by tres.fin...@gmail.com on 2 Jan 2014 at 2:38