畫布ScreenShot無法正常工作

Question

不久前，我能夠使用toDataURL函數從webGL 3D模型中截取屏幕截圖 ，但是突然這停止了工作 ，現在我無法從任何 3D模型中獲取圖像。

請參閱下面的波紋管以獲得更多見解：

ThreeJS示例：

• http://threejs.org/examples/webgl_animation_cloth.html
• http://threejs.org/examples/webgl_buffergeometry.html

WebGL示例：

• http://madebyevan.com/webgl-water/

基本示例：

• http://stemkoski.github.io/Three.js/HelloWorld.html
• http://learningwebgl.com/lessons/lesson01/index.html

在前面的所有示例中，我都沒有得到圖像，而是得到了黑色或透明圖像

2D：

• http://jsfiddle.net/m7sA9/show/

只有2D實例會返回正確的圖像

在前面的所有示例中，我都使用這種簡單的方法來獲取圖像。

document.getElementsByTagName('canvas')[0].toDataURL();

任何我做錯事的想法嗎？

---

我已經在MacBook Pro：Chrome和FireFox以及Windows 8.1的FireFox上嘗試過此操作，但結果卻相同

以下是有關如何在Chrome上進行測試的動畫

Answer 1

我已經找到了解決在我Threejs應用這個問題，解決辦法是將作為一個標志設置為true，那么簡單，我threejs instanciation我加preserveDrawingBuffer ：

var renderer   = new THREE.WebGLRenderer({
  preserveDrawingBuffer   : true   // required to support .toDataURL()
});

而對於使用ThreeJs的模型來說就是這樣，因此我認為問題與配置設置有關，使用普通WebGl或其他庫必須有一些選擇。

感謝您的閱讀，希望以后對您有所幫助。