Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to clone ImageData?

This is working, but I feel this code is lengthy. I'm looking for better idea.

var clone = function(imageData) {
  var canvas, context;
  canvas = document.createElement('canvas');
  canvas.width = imageData.width;
  canvas.height = imageData.height;
  context = canvas.getContext('2d');
  context.putImageData(imageData, 0, 0);
  return context.getImageData(0, 0, imageData.width, imageData.height);
};
like image 864
minodisk Avatar asked Jun 14 '12 05:06

minodisk


People also ask

What is ImageData?

The ImageData interface represents the underlying pixel data of an area of a <canvas> element. It is created using the ImageData() constructor or creator methods on the CanvasRenderingContext2D object associated with a canvas: createImageData() and getImageData() .

Which method returns an object that contains image data of a specific ImageData object?

The getImageData() method returns an ImageData object that copies the pixel data for the specified rectangle on a canvas.


1 Answers

The ImageData constructor accepts the image data array.

const imageDataCopy = new ImageData(
  new Uint8ClampedArray(imageData.data),
  imageData.width,
  imageData.height
)
like image 118
markbrown4 Avatar answered Oct 18 '22 02:10

markbrown4