WebGL flush & finish

나는 많은 데이터 드로잉이있는 웹 사이트를 화면에 만들었습니다. 사용자는 데이터 사이를 드래그하여 확대 할 수 있습니다 (&).WebGL flush & finish

좋은 그래픽 카드로 컴퓨터에서 실행 중이며 상호 작용이 매우 원활합니다. 다른 그래픽 카드에서 실행 중이며 마우스 커서를 놓은 후에 이미지가 실행 중입니다. 몇 밀리 초 후에 올바른 위치로 되돌아갑니다.

OpenGL에서 프로그래밍 할 때 나는 단순히 모든 GPU 처리가 끝날 때까지 기다리는 GPL glFlush & glFinish 방법을 사용했습니다. WebGL에서도 동일하지만 어떤 이유로 작동하지 않습니다. 이 방법을 사용하는 OpenGL에서 드로어 속도가 떨어지지 만 사용자가 커서를 따라 움직이는 이미지를 보는 것보다 낫습니다.

WebGL에서 그렇게하는 다른 트릭이 있습니까?

p.s. 최신 버전의 크롬을 사용하고 있습니다.

출처

2014-11-23 Raziza O

아직 작성하지 않았다면 requestAnimationFrame 콜백 내에서 모든 그림을 만들고 있는지 확인하십시오. 즉, 이벤트에 응답하여 다시 그리지 말고, 무엇이든 변경된 경우 콜백을 예약하십시오.

// need to redraw 
window.addEventListener('mousemove', function (event) { // or whatever 
    ... update drawing parameters, but don’t draw ... 
    markDirty(); 
}, false); 

... 

var scheduled = false; 
function markDirty() { 
    if (!scheduled) { 
    scheduled = true; 
    requestAnimationFrame(draw); 
    } 
} 

... 

function draw() { 
    scheduled = false; 

    ... do WebGL things here ... 
}

이것은 당신이 (당신이 볼 같은 지연의 원인)으로 유지할 수 있습니다 브라우저보다 더 많은 드로잉을 수행되지 않도록하며, 그것이 가장 좋은 시간에 발생하는 브라우저가 그것을 예약 할 수 있습니다. 난

(당신이 연속 애니메이션을 실행하는 경우뿐만 아니라 사용자의 입력에 반응. 다음 내 예제의 scheduled 및 markDirty 부분을 건너 뛰고 draw 내에서 requestAnimationFrame(draw);를 호출합니다.)

출처

2014-11-23 17:33:53

은하지 않습니다 내 제 3 자로부터 애니메이션, 마우스 드래그 이벤트 리스너를가집니다. 지금 직접 드로잉 메서드를 호출하는 대신 당신이 물어 보는대로 내가 지금 계획된 드로잉을 사용하고 있습니다. 나는 더 나은 결과를 내 방식 (감사)과 비교했지만 이미지는 여전히 커서가 약간 움직이고있다. 다른 방법이 있습니까? –

@RazizaO 더 이상 아이디어가 없습니다. 나는 *를 실행할 때 문제를 보여주는 프로그램의 컷 다운 버전을 포함하도록 질문을 편집하는 것이 좋습니다. 이렇게하면 응답자가 문제를 진단하는 데 크게 도움이됩니다. –

WebGL flush & finish

답변

관련 문제