Html2Canvas Resize
Based on Mikkos hint the following woked for me
window.html2canvas([$('body')[0]], {
onrendered: function(canvas) {
var extra_canvas = document.createElement("canvas");
extra_canvas.setAttribute('width',70);
extra_canvas.setAttribute('height',70);
var ctx = extra_canvas.getContext('2d');
ctx.drawImage(canvas,0,0,canvas.width, canvas.height,0,0,70,70);
var dataURL = extra_canvas.toDataURL();
var img = $(document.createElement('img'));
img.attr('src', dataURL);
// insert the thumbnail at the top of the page
$('body').prepend(img);
},
});
You can create additional new <canvas>
with thumbnail dimensions and use drawImage() to scale it down on this new <canvas>
.
drawImage() can read <canvas>
as image
source and you may set target width and height.
https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Using_images