threejs canvas todataurl为空 [英] threejs canvas todataurl is blank
问题描述
好的,我知道canvas.toDataUrl()会生成png格式的图像.但是,当我尝试从 http://threejs.org/examples/#webgl_lines_sphere 获取图片时.我所看到的只是镀铬的黑色图像.复制步骤-
Okay, I know that canvas.toDataUrl() will produce an image in png format. However, when I try to get the image from http://threejs.org/examples/#webgl_lines_sphere. All I see is a black image on chrome. To replicate the steps -
1)打开开发者控制台,然后选择canvas元素.
2)canvas = $0
3)context = canvas.getContext('webgl', {preserveDrawingBuffer: true})
4)img = canvas.toDataUrl()
5)document.write('<img src="'+img+'"/>')
1) Open dev console and select the canvas element.
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 上使用其他画布. .请执行以下步骤进行复制.
The image is blank. However, I tried with a different canvas at link http://threejs.org/examples/#canvas_geometry_cube. Please do the following steps to replicate.
1)打开开发者控制台,然后选择canvas元素.
2)canvas = $0
3)context = canvas.getContext('2d', {preserveDrawingBuffer: true})
4)img = canvas.toDataUrl()
5)document.write('<img src="'+img+'"/>')
1) Open dev console and select the canvas element.
2) canvas = $0
3) context = canvas.getContext('2d', {preserveDrawingBuffer: true})
4) img = canvas.toDataUrl()
5) document.write('<img src="'+img+'"/>')
这给出了预期的结果.为什么会有区别?又如何避免获取第一张图片?
This gave the expected result. Why is there a difference and how can this be avoided to retrieve first image too?
推荐答案
我也得到了纯黑色图像.
I was also getting a solid black image.
我以前的代码是:
this.renderer = new THREE.WebGLRenderer({premultipliedAlpha: false});
我已将THREE.WebGLRenderer
中的参数更改为:
I have changed the parameter in the THREE.WebGLRenderer
to:
this.renderer = new THREE.WebGLRenderer({preserveDrawingBuffer: true});
我正在拍摄快照.
希望有帮助.
这篇关于threejs canvas todataurl为空的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!