なぜtoDataUrl（）乗数はFabric.jsで私にとってうまくいかないのですか？

Question

私は画像を拡大表示できるFabric.js Canvasを持っており、キャンバスのサイズを変更することなくフルサイズの画像を保存したいと考えています。

したがって、toDataURLメソッドでの倍数パラメータを使用しています。

乗数の値を1に設定すると、期待どおりに動作しますが、それ以外の値は正しいサイズの画像を返しますが空白になります。

私のコードはこれです：

fabric.Image.fromURL('drawing.png', function (img) { 

    canvas.add(img); 

    // LOGS CORRECT IMAGE 
    console.log(canvas.toDataURL({ format: 'png', multiplier: 1 })); 

    // LOGS A BLANK IMAGE 
    console.log(canvas.toDataURL({ format: 'png', multiplier: 2 })); 

}, { crossOrigin: 'anonymous' }); 

誰もが正しい方向に私を指すことができますしてください？

Answer 1

var canvas = window._canvas = new fabric.Canvas('c'); 
 

 
fabric.Image.fromURL('http://fabricjs.com/assets/pug_small.jpg', function(oImg) { 
 
    canvas.add(oImg); 
 
    oImg.set({ 
 
    scaleX:2, 
 
    scaleY:2 
 
    }); 
 
    oImg.setCoords(); 
 
    setImage(oImg.toDataURL()); 
 
    canvas.renderAll(); 
 
}, { crossOrigin: 'anonymous' }); 
 

 
function setImage(val){ 
 
    var el = document.getElementById('result'); 
 
    el.src = val; 
 
}

canvas { 
 
    border: 2px solid #999; 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.17/fabric.min.js"></script> 
 
<canvas id="c" width="300" height="300"></canvas> 
 
<br> 
 
<img id='result' alt="">

だけそのイメージをしたい場合は、ドゥルガーは、私はキャンバス上に描画する場合は、この図面で画像を返しますobject.toDataURL();