Three.js를 toDataUrl 빈

Question

나는 완전히 빈 나오는 렌더링 WebGL을 three.js를에서 이미지를 저장하려고하지만, 문자의 톤 돌아 않는 경우 :

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAK8AAADICAYAAACeY7GXAAADt0lEQ…IF4M2+znB4GcgWgDf7OsPhZSBbAN7s6wyHl4FsAXizrzP8AS/TAMmecuTCAAAAAElFTkSuQmCC 

나는 preserveDrawingBuffer 세트를 수행하십시오 진실과 같이 :

renderer = new THREE.WebGLRenderer({ 
    alpha: true, 
    antialias: true, 
    preserveDrawingBuffer: true 
}); 

그리고 이것은 내가 toDataUrl 호출 오전 방법은 다음과 같습니다 여기

var getImageData = false; 
function render() { 

      //camera.position.x += (mouseX - camera.position.x) * .005; 
      //camera.position.y += (- mouseY - camera.position.y) * .005; 

      camera.lookAt(scene.position); 

      renderer.render(scene, camera); 
      if(getImageData == true){ 
       imgData = renderer.domElement.toDataURL("image/png"); 
       window.setTimeout(10); 
       console.log(imgData); 
       getImageData = false; 
      } 
      requestAnimationFrame(render); 
     } 


      getImageData = true; 

그리고를한다 내가 왜 이미지로, 어떤 아이디어가 아닌 다른 무슨 말을 모르겠습니다

CanvasCode

<canvas width="175" height="200" style="width: 175px; height: 200px"></canvas> 

솔직히

캔버스 : 전에 이미지 렌더링처럼 캔버스 모습 완전히 공백으로오고있다? render() 함수는 코드의 맨 마지막에 있습니다.

Answer 1

WebGL은 비동기 API입니다. 따라서 toDataUrl()을 호출하기 전에 gl.finish() (성능을 악화시킬 수 있음) 전화를 추가하거나 다음 프레임에서 호출해야합니다. (당신이 있다고했지만, 잘못을하고) setTimeout을 사용할 수 있습니다 예를 들어, 그래서 당신을 수행합니다

나는 여전히 이미지를 렌더링하는 얻이 수없는 것