Question

我在尝试保存使用html2canvas生成的图像时遇到了此错误消息。

所以我写了这段代码：

<div id"mycanvas">
    <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    <div id="container2" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    <div id="container3" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
</div>

 </page> 


<script type="text/javascript">
var canvas = document.getElementById("mycanvas");
var img    = canvas.toDataURL("image/png");
document.write('<img src="'+img+'"/>');
    </script>

即使渲染的图像在缓存中并且使用html2canvas生成好，我也不知道如何保存它。

此代码似乎没有错，但它向我显示此错误消息。

所以我有点失落。

以下是错误消息：

Uncaught TypeError: Cannot call method 'toDataURL' of null export-graphic-stat_employee.php:241
html2canvas: Preload starts: finding background-images Core.js:18
html2canvas: Preload: Finding images Core.js:18
html2canvas: Preload: Done. Core.js:18
html2canvas: start: images: 0 / 0 (failed: 0) Core.js:18
Finished loading images: # 0 (failed: 0) Core.js:18
html2canvas: Renderer: Canvas renderer done - returning canvas obj Core.js:18
Screenshot created in 167 ms<br /> Core.js:18

得到我最大的尊重。

亲切的问候。

S.P。

Answer 1

你在这里错过了一个等号;

<div id"mycanvas">

...这意味着你......

document.getElementById("mycanvas");

将返回null。

调用null.toDataURL("image/png");会给您提供错误消息。

编辑：如果你想实际使用toDataURL，那么该方法只适用于实际的canvas元素，并且你试图在div上使用它。相反，请删除div上的ID，然后添加;

<canvas id="mycanvas" width="400" height="400" > </canvas>

或使用HTML2Canvas生成的画布中的实际画布ID来使用实际的画布元素。

未捕获的TypeError：无法调用null的方法'toDataURL'

1 个答案: