HTML2Canvas和JSPDF无法在PDF文件中导出SVG

时间:2018-11-08 14:16:41

标签: reactjs jspdf html2canvas

我在Reactjs项目中使用html2canvas vs jsPDF,并且我有将DOM节点导出为PDF文件的要求。导出时,保留了HTML和CSS,而SVG无法保留。我不知道为什么。客户端上还有其他软件包可以帮助我吗?感谢您的关注。 这是我要导出的代码

none

1 个答案:

答案 0 :(得分:0)

我能够通过使用onClone选项进行后期处理来解决该问题

const options = {
  scale: 1,
  foreignObjectRendering: true,
  onclone: (element) => {
    const svgElements: any[] = element.body.getElementsByTagName('svg');
    Array.from(svgElements).forEach((svgElement) => {
        const bBox: any = svgElement.getBBox();
        svgElement.setAttribute('width', bBox.width);
        svgElement.setAttribute('height', bBox.height);
    });
  },
};

  html2canvas(<HTMLScriptElement>document.querySelector('.main-container'), options).then(canvas => {
      this.clipImage = canvas.toDataURL('image/png');
  });