Processing.js에서 알파 채널 마스킹 - 캔버스에서 투명 영역 만들기

Question

나는 Processing.js로 캔버스의 투명도로 연주하고 있습니다.

http://www.adamtindale.com/blog/processing/129/

이 스케치를 기반으로 :

http://www.openprocessing.org/sketch/74380

나는 다음과 같은 일을 만들려면 : 캔버스는 어떤 색으로 채워 져야 그것의 일부가되어야합니다이 튜토리얼을 읽고 나면 투명 (이 장소에서만 아래 웹 사이트를 볼 수 있음).

PGraphics를 MULTIPLY 모드로 블렌딩하면이 작업을 간단하게 수행 할 수 있다고 생각했습니다. 내가 자르고 자하는 영역은 마스크 Pgraphic에서 색상 (0, 0, 0, 0)으로 채워져 있으므로 아무 것도 곱하지 않으면 (0,0,0,0) - 즉 투명해야합니다.

그럼에도 불구하고 제대로 작동하지 않습니다. 코드는 I가 사용

PGraphics g; 
void setup() 
{ 
    size(720, 480); 
    // create the mask 
    g = createGraphics(width,height, P2D); 
} 

void draw() 
{ 
    externals.context.clearRect(0,0,width,height);// part of the canvasAPI that creates a clear rect 

    fill(244,90,10,40); 
    rect(2,2,300,300); 

    // draw the mask 
    g.beginDraw(); 
    g.stroke(255); 
    g.fill(0,0,0,0); 
    g.ellipse(100,100,150,150); 

    g.endDraw(); 

    // apply the mask to the screen 
    blend(g,0,0, width,height, 0,0,width,height,MULTIPLY); 
} 

이 코드 해야 원형 구멍 (타원)과 반투명 오렌지 구형 결과.

누락되었거나 완전히 잘못된 방법이 있습니까?

Google 크롬 및 Opera에서 테스트되었습니다. 쿠분투 12.04.1

결과 내가 얻을 :

Answer 1

당신은 할 iframe이의 사업부를 말할 것이다 setup()

parent.document.getElementById("yourDivID").setAttribute("style", "background-color:transparent; border:0px;");

이 이상이 줄을 누락 투명하게 설정하십시오.

참고 : div의 실제 ID는 "yourDivID"으로 대체하십시오.