Question

我正在尝试处理SVG图像以将其放入PDF（使用 pdfMake ），并且它需要采用数据URI格式。我写的代码与其他代码完美配合，但没有一个特定的SVG。

我写了一个简单的jsfiddle来显示行为：

  var canvas = document.getElementById("result-canvas");
  canvg(canvas, "" + svg);
  var img = canvas.toDataURL("image/png");
  document.getElementById("result-img").src = img;

jsFiddle

此外，如果您在按钮上单击两次 img 将正确显示。

感谢。

更新（发现黑客）

似乎我发现了一个黑客来避免这个错误，但仍然不知道它为什么会发生。我的解决方案是删除在Highcharts构建时自动在SVG中创建的图像标记（您可以在小提琴中看到图像元素）。所以这或多或少是代码：

    var svg_elem = $(svg); // SVG string as DOM element
    svg_elem.find('image').remove(); // Remove inside image tag
    canvg(canvas, svg_elem.prop('outerHTML')); // SVG to canvas
    var img = canvas.toDataURL("image/png"); // Canvas to Data URI

.toDataUrl（）返回特定画布上的空白图像/ svg

0 个答案: