пример
Приведенный ниже код копирует данные пикселя для указанного прямоугольника на холсте с 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);
} Попробуй сам " Поддержка браузеров
Числа в таблице указать первую версию браузера, который полностью поддерживает метод.
| метод | |||||
|---|---|---|---|---|---|
| putImageData() | да | 9.0 | да | да | да |
Определение и использование
putImageData() метод помещает данные изображения (от указанного объекта ImageData) обратно на холсте.
Совет: Читайте о getImageData() метод , который копирует данные пикселя для указанного прямоугольника на холсте.
Совет: Читайте о createImageData() метод , который создает новый пустой объект ImageData.
JavaScript Синтаксис
| Синтаксис JavaScript: | context.putImageData(imgData,x,y,dirtyX,dirtyY,dirtyWidth,dirtyHeight ); |
|---|
Значения параметров
| параметр | Описание |
|---|---|
| imgData | Задает объект ImageData положить обратно на холст |
| x | Координаты х, в пикселях, левого верхнего угла объекта ImageData |
| y | Y-координату, в пикселях, левого верхнего угла объекта ImageData |
| dirtyX | Необязательный. Значение по горизонтали (х), в пикселях, где поместить изображение на холсте |
| dirtyY | Необязательный. Значение по вертикали (у), в пикселях, где поместить изображение на холсте |
| dirtyWidth | Необязательный. Ширина использовать для рисования изображения на холсте |
| dirtyHeight | Необязательный. Высота использовать, чтобы нарисовать изображение на холсте |