执行canvas.toDataUrl（）时出现空白图像

Question

1. 转到this website。

2. 打开控制台并写下：

`

var canvas = $("#mandelbox-canvas")[0];
var imgData = canvas.toDataURL("image/png").split(',')[1];
console.log(imgData);

1. 复制数据网址并粘贴到this site。



为什么图像空白？我该如何解决这个问题？

我已经尝试过的事情：

I have tried the solution to this question。 I.E.这段代码：

var canvas = $("#mandelbox-canvas")[0];
canvas.getContext('webgl',{preserveDrawingBuffer:true});
var imgData = canvas.toDataURL("image/png").split(',')[1];
console.log(imgData)

但是图像仍然是空白的。图像不包含画布上显示的图像。

Answer 1

所以经过StackOverflow的拖网搜索后，我发现函数drawScene()（以某种方式？）迫使toDataURL()根据需要返回图像数据：

var canvas = $("#mandelbox-canvas")[0];
drawScene()
var imgData = canvas.toDataURL("image/png").split(',')[1];
console.log(imgData)