23

ブラウザに画像があります。

画像が回転しているかどうかに関係なく、画像の色の左上のピクセル (座標: 0,0) を取得したい。

javascriptまたはphpコードを使用して、どうすればそれを行うことができますか?

4

2 に答える 2

50
  • キャンバス ドキュメントを作成する.createElement
  • 2D コンテキストを取得するcanvas.getContext('2d')
  • キャンバスに画像を描画するcontext.drawImage(image, x, y)
    • 画像が同じドメインのものであることを確認してください。そうしないと、そのピクセルにアクセスできなくなります
  • 画像のピクセル データを取得するcontext.getImageData(x1, y1, x2, y2)
    • 左上だけが欲しいのでcontext.getImageData(0, 0, 1, 1)
  • datagetImageData の結果は、そのフィールドにピクセルの配列を持ちます(context.getImageData(0,0,1,1).data)
    • 配列には、、、rおよび値が含まgれます。ba
于 2013-07-22T13:47:24.927 に答える
18

ブラウザ上の画像の場合、最初に画像をサーバーに転送できない限り、PHP を使用できません。

ブラウザで画像を描画できる場合は、次のメソッドcanvasを使用できます。getImageData()

var myImg = new Image();
myImg.src = 'image.jpg';
var context = document.getElementById('canvas').getContext('2d');
context.drawImage(myImg, 0, 0);
var data = context.getImageData(x, y, 1, 1).data;

回転を許可する必要があります-おそらく、どの回転が適用されたかを知っているでしょう。

于 2013-07-22T13:47:21.713 に答える