캔버스 PutImageData 색상 손실 없음/낮음 알파

3x3 이미지가 있습니다. CanvasPixelArray은 다음과 같습니다캔버스 PutImageData 색상 손실 없음/낮음 알파

[12,24,48,255,12,24,48,255,12,24,48,255,12,24,48,255,12,24,48,255,12,24,48,255,12,24,48,255,12,24,48,255,12,24,48,255]

I 0으로 모든 픽셀의 알파를 변경하고 다시 기준 :

bobs = this.gfx.getImageData(0,0,3,3).data 
for (a=3;a<bobs.data.length;a+=4) 
bobs.data[a] = 0 
this.gfx.putImageData(bobs,0,0) 
bobs = this.gfx.getImageData(0,0,3,3).data 
for (a=3;a<bobs.data.length;a+=4) 
bobs.data[a] = 255 
this.gfx.putImageData(bobs,0,0)

모든 픽셀이 검은 색이되었다. 브라우저는 메모리를 절약하기 위해 색상을 검정색으로 변경했습니다. 이 문제를 방지 할 수있는 방법이 있습니까? 아니면 중복을 저장해야합니까?

출처

2011-05-04 bopjesvla

문맥에 대해 조금 더 자세히 설명해 주시겠습니까? 이걸 어디에서 사용해야합니까? http://jsfiddle.net/에서 연주 할 구체적인 예가 있으면 멋지기도합니다. –

캔버스가 미리 곱셈 된 알파를 사용한다는 이유는 모든 rgb 값에 해당 픽셀의 알파 값을 곱한 것입니다. 그것은, 배경을 가진 알파 블렌딩 속도를 끝낼 등

이 문서의 미리 알파가 곱셈에 대한 섹션이있다

: wikipedia:Alpha_compositing

당신이 수정되지 않은 값의 복사본을 유지 말하는대로 당신은 아마 중 하나를해야합니다, 또는 이미지의 알파 값을 저장하고 이미지를 그리기 전에 globalAlpha 속성을 설정할 수 있습니다. (이미지라고 말하면 3x3 캔버스를 똑같이 만들고 그곳에 픽셀을 저장 한 다음 drawImage()를 사용하여 기본 캔버스에 그릴 수 있습니다.

출처

2011-08-25 14:39:00 andrewmu

브라우저 버그입니까, 아니면 미리 곱한 알파 처리로 인해 색상 손실이 허용되는 HTML5 캔버스 사양입니까? – Chris

신경 쓰지 마세요. http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html : "변환으로 인한 손실의 본질 때문에 미리 곱셈 된 알파 색상 값에서 putImageData()를 사용하여 방금 설정된 픽셀은 다른 값으로 동일한 getImageData()로 리턴 될 수 있습니다. " – Chris

캔버스 PutImageData 색상 손실 없음/낮음 알파

답변

관련 문제