2012-06-20 2 views
2

putImageData는 변형에 영향을받지 않으므로 이미지의 픽셀을 조작하고 결과에 변환을 사용하려면 어떻게해야합니까? 예를 들어 그림에서 빨간색을 더 밝게 만들고 그림을 36도 회전하고 싶습니다.html5 캔버스 픽셀 조작 및 변환

회전 할 수 없어서 putImageData를 사용하는 것이 대답이 아닌 것 같습니다. 새로운 캔버스에 넣고 drawImage (newCanvas, 0,0)를 사용했지만 이미지를 전혀 그려 내지 못했습니다.

내가 곤혹 스럽다.

+0

컨테이너에 캔버스 요소를 래핑하고 캔버스에서 픽셀 조작을 실행 한 다음 CSS 또는 JS로 래퍼를 회전 할 수 있습니까? – Aaron

답변

0

새 캔버스를 사용하면 효과적입니다. 이미지를 먼저 추출하면됩니다. 이런 식으로 뭔가가 작동합니다 :

Image img = new Image(); 
img.src = newCanvas.toDataURL(); 
canvas.drawImage(img, x, y); // img is drawn with current transformation 

toDataURL()를 호출

캔버스 내용의 스냅 샷을; 통화가 이미지에 나타나지 않으면 newCanvas의 내용이 변경됩니다.