画布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一样简单，所以在我的三个实例中我添加了preserveDrawingBuffer：

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

这就是使用ThreeJ的模型，所以我认为问题与配置设置有关，并且必须有一些使用普通WebGl或其他库的选项。

感谢您阅读，我希望将来可以帮助某人。