2012-09-14 2 views
1

Я встретил это сообщение об ошибке при попытке сохранить изображение, которое было создано с использованием html2canvas.Uncaught TypeError: Не удается вызвать метод 'toDataURL' из null

Так что я написал этот код:

<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.

ответ

2

Вам не хватает знака здесь;

<div id"mycanvas"> 

... что означает, что ваш ...

document.getElementById("mycanvas"); 

возвратит нуль.

Вызов null.toDataURL("image/png"); является то, что выдает сообщение об ошибке.

EDIT: Если вы действительно хотите использовать toDataURL, этот метод работает только с фактическим элементом холста, и вы пытаетесь использовать его на div. Вместо этого удалите идентификатор на div и либо добавьте;

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

или использовать фактический холст идентификатор из холста, генерируемого HTML2Canvas иметь фактический элемент холста для работы с.

+0

О, вы правы. Но теперь он отображается для меня. Uncaught TypeError: Object # не имеет метода 'toDataURL' –

+0

Большое спасибо за помощь. Странная часть этого заключается в том, что Html2canvas отображает мне изображение, и когда я пытаюсь его сохранить, это пустое изображение белого изображения. –

+0

@StanislasPiotrowski 'html2canvas' создает элемент canvas, так что это тот, который вы хотите использовать, а не div. Не знаете, как получить или установить идентификатор элемента, хотя вы можете получить к нему доступ. –

Смежные вопросы