2013-08-11 3 views
0

В чем проблема с toDataURL() функцией в моем коде !?
Моя проблема в том, что холст p0 останется пустым!
Загрузив свое изображение в dataurl.net, я узнал, что код DataUrl и мой код DataUrl, который был сохранен в LocalStorage, разные! и поэтому он ничего не может показать!canvas.toDataURL() генерировать неверный DataURL

<canvas id="p0" width="512" height="176" style="margin-left: 200px; margin-top: 216px; position: absolute"></canvas> 
<script> 
function init() { 
    var p0 = document.getElementById("p0"); 
    var P0 = p0.getContext('2d'); 
    var img = new Image; 
    img.onload = function() { 
     P0.drawImage(img, 0, 0); 
    }; 
    if (localStorage.getItem("version") == Version) { 
     img.src = localStorage.getItem("p0"); 
    } else { 
     localStorage.setItem("version", Version); 
     img.src = "Index/2/logo.png"; 
     localStorage.setItem("p0", p0.toDataURL("image/png")); 
    } 
} 
init(); 
</script> 
+2

Вы получаете данныеUrl с пустого холста? Подождите, пока изображение не будет загружено, а затем сериализуется после его рисования! – Bergi

+0

@Bergi, спасибо, чувак! –

ответ

2

Благодаря Берги,
Это просто нужно поставить эту строку:

localStorage.setItem("p0", p0.toDataURL("image/png")); 

в функцию img.onload.

img.onload = function() { 
    P0.drawImage(img, 0, 0); 
    localStorage.setItem("p0", p0.toDataURL("image/png")); 
}; 
Смежные вопросы