Makosa ya HTML canvas putImageData()

Makala ya Kielektroniki ya HTML5 Canvas

Maana na matumizi

putImageData() Makosa inayoweza kirepika data ya picha kwenye kina kutoka kwa kipya cha ImageData yenye kina.

Mafanikio:Tazama getImageData() Makosa, inayoweza kurepika data ya pixeli ya kati ya kina yenye kina.

Mafanikio:Tazama createImageData() Makosa, inayoweza kumwiza kipya cha ImageData kipya.

Mfano

Mafanikio ya chini ya kitabu hiki inatumia getImageData() kurepika data ya pixeli ya kati ya picha yenye kina, kisha kirepika data ya picha hii kwenye kina kwa mbali mpya kwa mbali mpya:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="green";
ctx.fillRect(10,10,50,50);
function copy()
{
var imgData=ctx.getImageData(10,10,50,50);
ctx.putImageData(imgData,10,70);
}

Jaribu kwa mwenyewe

makosa

mikono.putImageData(imgData,x,y,dirtyX,dirtyY,dirtyWidth,dirtyHeight);

malo

mifano kuwa
imgData Inapendekeza Kina ya Data ya Picha inayotumika kwa kina cha picha.
x Msingi wa kina ya kimoja ya Kina ya Data ya Picha, kwa ukili wa picha, kwenye kina cha kimoja.
y Msingi wa kina ya kimoja ya Kina ya Data ya Picha, kwa ukili wa picha, kwenye kina cha kimoja.
dirtyX Inahofuata. Msingi (x), kwa ukili wa picha, inapendekeza kina cha picha kwenye kina.
dirtyY Inahofuata. Msingi (y), kwa ukili wa picha, inapendekeza kina cha picha kwenye kina.
dirtyWidth Inahofuata. Upanda unaotumiwa kwenye kina cha picha.
dirtyHeight Inahofuata. Urefu unaotumiwa kwenye kina cha picha.

Mawasiliano wa Kifaa

Inafikia kina ya tovuti ambayo inasimamia sababu ya kufikiria matokeo wa sababu hiyo.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Kashisho:Internet Explorer 8 na vyote vya zamani hawakubali kina <canvas>.

Makala ya Kielektroniki ya HTML5 Canvas