1

私は複雑なタスクに取り組んでいるので、私の問題はあまり意味がないはずですが、問題は、putImageData以前にを介して取得したあるポイントの色情報を使用してポイントを描画する方法getImageDataです。

200pxの水平線A（0、0）-B（ 199、0）があるとしましょう。を使用してそのピクセルカラー情報を読み取ることができます

var pixels = ctx.getImageData(0, 0, 200, 1); // horizontal line :: 200 pixels

しかし、pixels配列（pixel.length = 800）ができたら、この線から別の場所にいくつかの点を描画したいと思います。線ではなく、ポイントするだけです。

これにより、線全体が描画されます。

ctx.putImageData(pixels, 20, 20);

しかし、線A-Bのn番目の点からのピクセルカラー情報を使用して1つの点 C（20、20）だけを描画するにはどうすればよいですか？

からのデータを使用putImageDataして、rgbaの配列（array.lenght = 4）でどのように使用できpixelsますか？

4

1 に答える 1

1

putImageData別の引数のセット、ダーティな長方形があります：

putImageData(imagedata, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight)

これにより、コピーバックする画像データ内の長方形を指定できます。その長方形のピクセルのみをキャンバスにコピーして戻します。

だから、あなたが言ったように、これはあなたにあなたの水平線を得るでしょう：

var pixels = ctx.getImageData(0, 0, 200, 1); // horizontal line :: 200 pixels

これにより、キャンバス内(20,0)の場所の画像データに1ピクセルが配置されます。(20,0)

ctx.putImageData(pixels, 0, 0, 20, 0, 1, 1)

x / yオフセットを0,0から開始する必要があることに注意してください。これは、汚れた長方形がどのように機能するかによるものです。（20,0）の1ピクセルを（0,0）に戻すのではなく、画像データ全体を（0,0）から元に戻しますが、内部のものを除いてコピーしません。汚れた長方形。これにより

于 2012-07-06T18:36:47.123 に答える