El método createImageData() se usa para crear un nuevo objeto ImageData en blanco. Los píxeles del nuevo objeto son de color negro transparente por defecto.
Hay dos sintaxis del método createImageData():
- Se utiliza para crear un nuevo objeto ImageData con las dimensiones especificadas (en píxeles):
Sintaxis:var imgData = context.createImageData(width, height);
- Se utiliza para crear un nuevo objeto ImageData con las mismas dimensiones que el objeto especificado por anotherImageData. No copia los datos de la imagen.
Sintaxis:var imgData=context.createImageData(imageData);
Valores paramétricos:
- ancho: indica el ancho (en píxeles) del nuevo objeto ImageData.
- altura: indica la altura (en píxeles) del nuevo objeto ImageData.
- imageData: Es el objeto anotherImageData
Ejemplo:
<!DOCTYPE html> <html> <body> <h3 style="color:green">GeeksforGeeks</h3> <h3>HTML canvas createImageData() Method</h3> <canvas id="myCanvas" width="200" height="200" style="border:2px solid ;"> </canvas> <p id=g eeks></p> <script> var can = document.getElementById("myCanvas"); var gfg = can.getContext("2d"); var imgData = gfg.createImageData(150, 100); var i; for (i = 0; i < imgData.data.length; i += 3) { imgData.data[i + 0] = 100; imgData.data[i + 1] = 0; imgData.data[i + 2] = 0; } gfg.putImageData(imgData, 10, 10); </script> </body> </html>
Producción:
Navegadores compatibles:
- Cromo
- Mozilla Firefox
- Internet Explorer 9.0
- Ópera
- Safari
Publicación traducida automáticamente
Artículo escrito por shubham_singh y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA