html2canvas返回黑色图像

时间:2014-03-20 16:27:53

标签: javascript php

我在通过html2canvas将div渲染为图像时遇到问题。

这是我的javascript代码:

function saveImages(i)
        {
            html2canvas($("#page"+i), {
                logging:true,
                onrendered: function(canvas){
                    var url = canvas.toDataURL();
                    $.post("saveImage.php", {"path": url, "index":i}, function(data){
                        var p = Math.round(((i+1)/totalPages)*100);
                        $("#progressGraphical").css("width", p+"%");
                        if(p>=100){p = "fertig!"}else{p += "%";}
                        $("#progress").html((i+1)+"/"+totalPages+" Seiten gespeichert - "+p);
                        if(i<totalPages) saveImages(i+1);
                    });
                }
            });
        }
        $(document).ready(function(){
            saveImages(0);
        });

由于使用jquery函数完成了post请求,我不得不递归地工作。 请求的php文件采用canvas.toDataUrl-Method生成的base64编码的url,对其进行解码并将其保存到名为&#34; page0 / 1/2 / ... / n.png&#34;的图像文件中。

所有这一切都正常 - 直到超过总共约24个递归调用。如果是这种情况,则html2canvas生成的所有图像(即使是第24次递归调用之前的图像)也会被绘制为空白。我已经查看了base64编码的url - 并且只有两个相等的字符串可以交替使用。

错误在哪里?

1 个答案:

答案 0 :(得分:3)

https://stackoverflow.com/a/23928038/1815624

  

只需将css background-color:#ffffff添加到您的表中:)

     

希望这会有所帮助

我将内容包装到每个所需页面的div中,然后将class="pdfpage"设置为pdfpage{background:#FFFFFF;}

正如我所评论的那样,首先我不需要将渲染元素的背景设置为白色,因为它已经是白色的......但实际上它是无色的......

复制了我的回答: https://stackoverflow.com/a/25457584/1815624