예
카피 아래 코드 화소와 캔버스에 지정된 사각형 데이터 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() | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
정의 및 사용
putImageData() 방법은 화상 데이터를 둔다 (from a specified ImageData object) 다시 캔버스 상.
Tip: [정보 읽기 getImageData() 이 캔버스에 지정된 사각형에 대한 복사 픽셀 데이터를 방법.
Tip: [정보 읽기 createImageData() 비어있는 새 imageData의 객체를 생성하는 방법.
자바 스크립트 구문
| 자바 스크립트 구문 : | context . putImageData( imgData,x,y, dirtyX,dirtyY,dirtyWidth,dirtyHeight ) ; |
|---|
매개 변수 값
| 매개 변수 | 기술 |
|---|---|
| imgData | 캔버스에 다시 넣어 imageData의 객체를 지정합니다 |
| x | 상기 imageData의 객체의 좌측 상단 모서리의 픽셀 X 좌표 |
| y | 상기 imageData의 객체의 좌측 상단 모서리의 픽셀 Y 좌표 |
| dirtyX | 선택 과목. 수평 (x) 값은 픽셀 위치를 캔버스에 화상을 배치 할 |
| dirtyY | 선택 과목. 수직 (y) 값이 픽셀 위치를 캔버스에 화상을 배치 할 |
| dirtyWidth | 선택 과목. 폭은 캔버스에 이미지를 그리는 데 사용하는 |
| dirtyHeight | 선택 과목. 높이가 캔버스에 이미지를 그리는 데 사용하는 |
<캔버스 개체