html - threejs Canvas todataurl 是空白的

标签 html canvas three.js webgl todataurl

好的,我知道 canvas.toDataUrl() 会生成 png 格式的图像。但是,当我尝试从 http://threejs.org/examples/#webgl_lines_sphere 获取图像时.我所看到的只是 chrome 上的黑色图像。复制这些步骤 -

1) 打开开发控制台并选择 Canvas 元素。 2) canvas = $0 3) context = canvas.getContext('webgl', {preserveDrawingBuffer: true}) 4) img = canvas.toDataUrl() 5) document.write('<img src="'+img+'"/>')

图像是空白的。 但是,我在链接 http://threejs.org/examples/#canvas_geometry_cube 尝试使用不同的 Canvas .请执行以下步骤进行复制。

1) 打开开发控制台并选择 Canvas 元素。 2) canvas = $0 3) context = canvas.getContext('2d', {preserveDrawingBuffer: true}) 4) img = canvas.toDataUrl() 5) document.write('<img src="'+img+'"/>')

这给出了预期的结果。为什么会有差异,如何避免检索第一张图像?

最佳答案

我也得到了纯黑色图像。

我之前的代码是:

this.renderer = new THREE.WebGLRenderer({premultipliedAlpha: false});

我已将 THREE.WebGLRenderer 中的参数更改为:

this.renderer = new THREE.WebGLRenderer({preserveDrawingBuffer: true});

我正在拍摄快照。

希望对您有所帮助。

关于html - threejs Canvas todataurl 是空白的,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34847293/

相关文章:

php - 使用 Jquery Ajax 和 PHP 的 Google 隐形 Recaptcha

java - 如果 HTML 包含特殊/非法字符,从 Html 创建 IText Pdf 将失败

html - 将 <canvas> 帧转换为视频?

HTML5 Canvas - 当 alpha < 1 时,相同的 RGBA 样式会产生不同的颜色

three.js - 如何在 three.js 中将 x、y、z 坐标数据转换为几何(顶点、面)?

javascript - JQuery - 可拖动的 DIV 在图像之间淡入淡出?

javascript - 适用于 Android 的全屏 Web 应用程序

javascript - Canvas 固定绘图点

javascript - Threejs中判断一个网格是否在另一个网格内

javascript - 如何在Three.js中使3d模型的边框平滑