1

画像からバイナリデータを取得したい。したがって、キャンバスに配置し、getImageDate メソッドで取得する必要があります。ただし、ソース PNG イメージのサイズと抽出されたキャンバス イメージのサイズを比較すると、それらは異なります。

var img = new Image();

img.onload = function() {
    var canvas = document.getElementById("c");
    canvas.width = this.width;
    canvas.height = this.height;
    var ctx = canvas.getContext("2d");
    ctx.drawImage(img, 0, 0);

    //get image
    var canvasimg = ctx.getImageData(0, 0, this.width, this.height);
    alert("binlength: " + canvasimg.data.length);
};

img.src = "images/example.PNG";

ここに例をアップロードしました: http://jsfiddle.net/wLb3q/4/

この動作は、JavaScript だけでなく、Firefox のコンテキストメニュー (キャンバスを右クリックして画像を保存) を介して行う場合にも発生します。取得された画像は、元の画像よりもかなり小さいです。

よろしくお願いします！

4

0 に答える 0