자바 스크립트 라이브러리

Question

작동하지 WebGL이-2D 애니메이션 I 캔버스 2D 도면을 "하드웨어 가속"을 위해 할 수있는 멋진 자바 스크립트 라이브러리를 발견 첫 번째 프레임에서 캔버스는 흰색입니다. 바이올린 여기

I 설정이이 저장소에서 예이기 때문에 내가 가진 http://jsfiddle.net/RaW5x/5/

그것을 가정하는 라이브러리입니다.

Answer 1

짧은 대답 : 나는 도서관의 결함이라고 생각하지 않지만 확실히 라이브러리가 해결해야 할 문제입니다.

특히 gl.colorMask(1, 1, 1, 0)을 사용하는 webgl-2d sets the GL color mask during initialization - 따라서 알파 채널에 대한 쓰기를 차단합니다.

이제는 화면을 흰색으로 바꾸기 위해 어떤 일이 일어나고 있는지 잘 모르겠다는 것을 인정해야합니다. 혼합 함수는 (src alpha, 1 - src alpha), 출력 된 모든 색상에 대해 원본 알파 구성 요소에 따라 배경색과 혼합됩니다. 소스 알파 채널이며, RD 대상 (현재 배경이기 때문에

Red = Rs * As + Rd * (1 - As) 

... 루피 소스 (신규) 레드 채널이며, 여기 단지 레드 채널에 대한 공식이다, 설명을 단순화하기) 레드 채널. 는 교체해야한다, 즉

Red = 0.196 * 1 + 0.196 * (1 - 1) = 0.196 

: 우리가 50의 빨강 색 (또는 ~ WebGL을 0.196)를 가정하면

그래서, 나의 이해는 무엇 가 일이되어야하는 점이다 새로운 색상으로 이전 색상.

Red = 0.196 * 0.5 + 0.196 * (1 - 0.5) = 0.196 

이 결과는 분명히 목적지 경우 변경되는 : 소스 채널이 1.0 이외의 알파가 포함 된 경우에도 대상 채널을 동등하게

한, 숫자는 결과를 약간 수정,하지만 사실 적색 채널은 소스 채널과 다르지만, 그렇다고해도 흰색 채널로 어떻게 작동하는지 알지 못합니다. 문제가 블렌딩만으로 발생한 것이라면 알파 채널의 값을 기준으로 한 흰색으로 점진적으로 나아갈 것으로 예상됩니다. 단일 프레임에서 흰색으로 점프하는 것이 아닙니다.

그래서 수학적으로 나에게 잘 보입니다. 그러나이 문제는 웹 글쓰기 프레임 워크 (Jax)에서 알파 마스크를 방지하기 위해 색상 마스크를 설정하여 재현 할 수 있으므로 라이브러리의 결함이 아닙니다. 내 추측에 의하면이 드라이버는 내 컴퓨터와 다른 컴퓨터에서 OpenGL 드라이버의 버그 일 수 있습니다.

나는이 문제를 계속 연구 할 것이고, 나는 무엇이든을 배울 수 있으면이 대답을 업데이트 할 것이다.

관련하여 문제는 webgl-2d 라이브러리에서 해결할 수 있습니다. 나는 개발자에게 submitted a pull request을 가지고있다. (참고로,이 질문에 링크 된 repo는 원래 저장소의 포크이며, 현재 관리자가 누구인지 알 수 없으므로 원래 저장소로 끌어 오기 요청을 보냈습니다.풀의 요청이있을 때까지)

가 (희망) 접수, 또는 문제가, 그렇지 않으면 해결, 나는 당신이 할 수 있다고 생각 :

이

ctxGL.colorMask(1, 1, 1, 1); 

... 어떤 렌더링을하기 전에, 그리고 그것을 그냥 작동합니다.