HTML कैनवास putImageData () विधि
उदाहरण
नीचे दिया गया कोड कैनवास पर एक निर्दिष्ट आयत के लिए पिक्सेल डेटा को getImageData () के साथ कॉपी करता है, और फिर छवि डेटा को वापस कैनवास पर putImageData () के साथ रखता है:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "red";
ctx.fillRect(10, 10, 50, 50);
function copy()
{
var imgData = ctx.getImageData(10, 10, 50, 50);
ctx.putImageData(imgData, 10, 70);
}
ब्राउज़र समर्थन
तालिका में संख्याएं पहले ब्राउज़र संस्करण को निर्दिष्ट करती हैं जो पूरी तरह से विधि का समर्थन करता है।
Method | |||||
---|---|---|---|---|---|
putImageData() | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
परिभाषा और उपयोग
PutImageData () विधि छवि डेटा (एक निर्दिष्ट ImageData ऑब्जेक्ट से) को वापस कैनवास पर रखती है।
युक्ति: getImageData() विधि के बारे में पढ़ें जो कैनवास पर एक निर्दिष्ट आयत के लिए पिक्सेल डेटा की प्रतिलिपि बनाता है।
युक्ति: createImageData() विधि के बारे में पढ़ें जो एक नया, रिक्त ImageData ऑब्जेक्ट बनाता है।
जावास्क्रिप्ट सिंटैक्स
जावास्क्रिप्ट सिंटैक्स: | संदर्भ .putImageData ( imgData, x, y, डर्टीएक्स, डर्टीवाई, डर्टीविड्थ, डर्टीहाइट ); |
---|
पैरामीटर मान
Parameter | Description |
---|---|
imgData | Specifies the ImageData object to put back onto the canvas |
x | The x-coordinate, in pixels, of the upper-left corner of where to place the image on the canvas |
y | The y-coordinate, in pixels, of the upper-left corner of where to place the image on the canvas |
dirtyX | Optional. The x-coordinate, in pixels, of the upper-left corner of where to start drawing the image. Default 0 |
dirtyY | Optional. The y-coordinate, in pixels, of the upper-left corner of where to start drawing the image. Default 0 |
dirtyWidth | Optional. The width to use when drawing the image on the canvas. Default: the width of the extracted image |
dirtyHeight | Optional. The height to use when drawing the image on the canvas. Default: the height of the extracted image |
❮ कैनवास वस्तु