0

貼り付けイベントをリッスンし、画像をクリップボードからサーバーに保存し、さらに描画するためにキャンバスに表示する必要があるプロジェクトに取り組んでいます。

何が機能しているか: クリップボードの画像を取得して保存し、画像をキャンバスに背景として表示します。

機能していないもの: キャンバスのサイズを変更して、画像全体を表示できるようにします。また、保存中は、図面を保存するだけでなく、背景画像に図面を保存しません。

私は試した

 var newImg = document.getElementById('justimg');
    newImg.src = data.showthis;
    newImg.onload= function(){
        curHeight = newImg.height;
        curWidth = newImg.width;
        alert(curWidth);
        alert(curHeight);}

画像属性を取得しますが、キャンバス属性のみを表示します。

 <img id="justimg">
<canvas id="bearimage" ></canvas>

また、キャンバスの描画を背景画像付きで保存する方法を提案してください。

4

1 に答える 1

0

キャンバス要素を取得してから、その幅と高さを次のように変更する必要があります。

var newImg = document.getElementById('justimg');
    newImg.src = data.showthis;
    newImg.onload= function(){
        var canvas = document.getElementById('bearimage');
        canvas.height = newImg.height ;
        canvas.width = newImg.width ;
        alert(canvas.height);
        alert(canvas.width);}

キャンバス画像を保存するには、最初に画像を描画してから保存する必要があります。画像を保存するためのリンクは次のとおりです。http://www.nihilogic.dk/labs/canvas2image/

于 2013-03-01T11:16:10.533 に答える