Canvas putImageData() तरीका

विन्यास और उपयोग

putImageData() तरीका जो चित्र डाटा (दिए गए ImageData ऑब्जेक्ट से) कैनवस पर वापस लाता है。

सूचना:देखें getImageData() तरीका जो कैनवस पर निर्दिष्ट चक्र के पिक्सल डाटा को कॉपी करता है。

सूचना:देखें createImageData() तरीका जो नए खाली ImageData ऑब्जेक्ट को बनाता है。

उदाहरण

नीचे कोड चित्र के विन्यास पर निर्दिष्ट चक्र के पिक्सल डाटा को कॉपी करता है और फिर ImageData() के माध्यम से चित्र डाटा कॉन्वस पर वापस लाता है:

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);
}

अपने आप प्रयोग करें

व्याकरण

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

पारामीटर मान

पारामीटर वर्णन
imgData कैनवस पर वापस लाने वाले ImageData ऑब्जेक्ट को निर्धारित करता है。
x ImageData ऑब्जेक्ट के उच्चांग्लिया के x स्थानांक (पिक्सल में)。
y ImageData ऑब्जेक्ट के उच्चांग्लिया के y स्थानांक (पिक्सल में)。
dirtyX वैकल्पिक।स्थानीय मान (x) रूपी स्थानीय मान (पिक्सल में), कैनवस पर चित्र को रखने के लिए。
dirtyY वैकल्पिक।स्तर (y) रूपी स्थानीय मान (पिक्सल में), कैनवस पर चित्र को रखने के लिए。
dirtyWidth वैकल्पिक।चित्र को कैनवस पर ड्रा करने के लिए उपयोग किए जाने वाली चौड़ाई。
dirtyHeight वैकल्पिक।चित्र को कैनवस पर ड्रा करने के लिए उपयोग किए जाने वाली ऊंचाई。

ब्राउज़र समर्थन

तालिका में दिए गए नंबरों को इस गुण को पूरी तरह से समर्थन देने वाले पहले ब्राउज़र का संस्करण निर्दिष्ट करते हैं।

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

टिप्पणी:Internet Explorer 8 और अधिक पुरानी संस्करण <canvas> एलीमेंट को समर्थन नहीं देते हैं。