threejs渲染器停止當我新建一個新的WebGLRenderer

Question

我想創建一個場景的快照，但是當我啓用preserveDrawingBuffer = true時，表現爲低，所以我做一個按鈕，當我點擊我創建的按鈕一個新的渲染如下：

  $("#shot").click(function() { 
    renderer = new THREE.WebGLRenderer({ 
     antialias: true, 
     preserveDrawingBuffer: true 
    }) 
    new TWEEN.Tween(camera.position).to({ 
     x: 0, 
     y: 400, 
     z: 1700 
    }, 1000).start(); 
    setTimeout(function() { 
     var pic = renderer.domElement.toDataURL('image/jpeg'); 
     console.log(pic); 
    }, 1100) 
}); 

但是這引起了新的問題，渲染和動畫採空，有什麼關於代碼事？爲什麼我無法創建新的渲染器？

Answer 1

您需要將renderer.domeElement附加到文檔的某個位置，以使其可見。

Answer 2

您無需設置preserveDrawingBuffer: true即可拍攝快照。您只需在渲染後拍攝快照並在退出當前事件之前拍攝快照。

renderer.render(scene, camera); 
const pic = renderer.domElement.toDataURL('image/jpeg'); 

看到這個答案：https://stackoverflow.com/a/30647502/128511