html2canvas无法呈现CHARTIST.JS生成的SVG图表

Question

我有这样的页面

我正在尝试使用html2canvas和jspdf将其导出为PDF。在使用html2canvas将此图表部分转换为画布后，它看起来像这样。

请帮助我该怎么办。

Answer 1

//id holds id of wrapper 'div' element which has child as svg graph (your chartist.js graph getting generated)

convertSVG(id) {
    let element = document.getElementById(id);
    html2canvas(element, {useCORS: true, dpi: 144}).then(function(canvas) {
      let img = new Image();
      img.src = canvas.toDataURL('image/png');;
      element.append(img);
      img.onload = function () {
        console.log('I believe, your svg has converted to image');
        var doc = new jsPDF();
        doc.addImage(img, 0, 0, doc.internal.pageSize.width, doc.internal.pageSize.height);
        doc.save("test.pdf")
      };
    });
  }