Question

我们知道有几个问题在讨论这个问题。但是，我们没有发现任何适合我们的东西。我们最初寻找的是一种将div保存为图像以便能够很好地打印它的方法。然后我们遇到了html2canvas，看起来很完美。

唯一的问题是我们使用SVG元素（连接我们的对象的线条），它们不会出现在图像中。这对于更多人而言是一个问题，但他们的问题似乎已经通过之前的更新解决了。 https://github.com/niklasvh/html2canvas/issues/95

我们试图让污点获得SVG（如建议here），但它不起作用。

我们加载了html2canvas和html2canvas.svg

<script src="html2canvas.js"></script>
<script src="html2canvas.svg.js"></script>

当有人按下“保存以便能够打印”按钮时调用此功能：

$(function() { 
$("#btnSave").click(function() {

    html2canvas($("#object_container"), {
        allowTaint: true
    });

    html2canvas($("#object_container"), {
        onrendered: function(canvas) {
            theCanvas = canvas;

            var dataUrl = canvas.toDataURL();
            window.open(dataUrl, "toDataURL() image", "width=800px, height=800px");

            canvas.toBlob(function(blob) {
                saveAs(blob, "savedImage.jpg"); 
            });
        }
    });

});
});

现在，我们不关心保存的文件，只关心在新窗口中打开的图像。在那张图片中，我们无法看到我们的svg线。

有什么建议吗？（我们是否正确设置了allowTaint？）

Html2canvas中的SVG元素无效

0 个答案: