イメージとして保存した後に要素サイズを保持する

Question

html2canvasとcanvas2imageを使用すると問題が発生します。私はこのコードを使用しています：

$('#preview').click(function() { 

var scaleBy = 5; 
var w = 1000; 
var h = 1000; 
var div = document.querySelector('#screenshot'); 
var canvas = document.createElement('canvas'); 
canvas.width = w * scaleBy; 
canvas.height = h * scaleBy; 
canvas.style.width = w + 'px'; 
canvas.style.height = h + 'px'; 
var context = canvas.getContext('2d'); 
context.scale(scaleBy, scaleBy); 

html2canvas(div, { 
    canvas:canvas, 
    onrendered: function (canvas) { 
     theCanvas = canvas; 
     var dataString = canvas.toDataURL("image/png"); 
     var link = document.createElement("a"); 
     link.download = 'image'; 
     link.href = dataString; 
     link.click(); 
    } 
}); 
}); 

#previewは、画像を保存するためのボタンIDである私はそれにその得るより多くのスペースを.pngのように画像を保存するときに、問題があります。このようにhttp://imgur.com/2EdlhX9。イメージに保存した後、どのようにサイズを要素のようにするのですか？ありがとう..

Answer 1

Html2canvasは、キャプチャされる要素の高さが&であることに基づいて要素のスクリーンショットをキャプチャしようとします。

また、html2canvasでキャプチャした画像の高さを&の幅に設定するオプションもあります。あなたはそこにあなたの新しい高さと幅を設定しようとすることはできますか？以下は例です。 例：

html2canvas(div, { canvas:canvas, 
    onrendered: function (canvas) { 
    // ur code logic 
    } 
    }, 
    { width: newWidth, height: newHeight} 
); 

これが役立ちます。