特に自分のページ用にグリースモンキーのJavaScriptコードを書き込もうとしています。このページには、ID「barcode」の img があります。
使うことができます
var imageattributes = document.getElementById('barcode');
ページから画像を取得します。私が欲しいのは、この画像のすべてのピクセルを配列で取得できるようにしたいということです。
私はstackoverflowを回っていて、これを行ういくつかの方法を見てきました。ピクスタも見ました。stackoverflow のソリューションに関する私の問題は、
var imgData = context.getImageData(0, 0, canvas.height, canvas.width);
動作しません。私が何をしようと。また、pixastic は、どこでもピクセル情報を表示する方法を示していません。彼らのドキュメントは、反転、ぼかしなどのためにすでに持っている機能のみをカバーしています.
私が現在持っているコードはこれです:
var imageattributes = document.getElementById('barcode').attributes;
var imageurl = imageattributes.getNamedItem("src").value;
var imageurl2 = imageurl.replace("..","http://localhost");
var img = new Image();
img.src = imageurl2;
context.drawImage(img, 0, 0);
var imgData = context.getImageData(0, 0, canvas.height, canvas.width);
var pixel = new Array();
for(i=0;i<canvas.height;i++){
pixel[i] = new Array();
for(j=0;j<canvas.width;j++){
pixel[i][j] = imgData.data[i*canvas.width+j*4];
}
}
document.getElementById('derp').innerHTML = imageurl;
これは、画像を取得し、src を取得し、それを新しい画像としてロードし、ピクセルを配列内に配置することになっています。最後の行は、コードが機能したかどうかを画面に表示するためのものです。したがって、URL が出力された場合は機能したことを意味し、機能していない場合は機能していないことを意味します。
誰でもこれで私を助けてもらえますか? ありがとうございました。