Question

我使用jsPDF和svg_to_pdf将SVG和表格导出为PDF。这是我的代码：

function svg_to_pdf(svg, callback) {

console.log("svgtopdf.js");
svgAsDataUri(svg, {}, function(svg_uri) {
var image = document.createElement('img');

image.src = svg_uri;
image.onload = function() {
  var canvas = document.createElement('canvas');
  var context = canvas.getContext('2d');
  var doc = new jsPDF('portrait', 'pt', 'a4', true);
  var dataUrl;

  source = $('#datos_alumnos')[0];
  specialElementHandlers = {
      '#bypassme' : function(element, renderer){
          return true;
      }
  };

  margins = {
            top: 40,
            bottom: 60,
            left: 40,
            width: 270
        };


  canvas.width = image.width;
  canvas.height = image.height;
  context.drawImage(image, 0, 0, image.width, image.height);
  dataUrl = canvas.toDataURL('image/jpeg');
  doc.addImage(dataUrl, 'JPEG', 0, 0, 500, 263);


  doc.fromHTML(
    source,
    40,
    270, {
        'width': 550,
        'elementHandlers': specialElementHandlers
    },

    function(dispose){
        //doc.save('SVG.pdf');
    }
    , margins);

callback(doc);
}
});
}

结果是PDF，顶部是图像，下一个是表格。当它进入第二页时问题就出现了，因为表的标题与第一行重叠，看起来像这样。

http://i.imgur.com/vlfm4Fv.png

是否可以删除第二页上的标题？

Answer 1

好的，所以我找到了一个可能的解决方案，如果你将这个脚本用于jsPDF

https://raw.githubusercontent.com/MrRio/jsPDF/master/dist/jspdf.debug.js

您可以下载它，并修改第5201行以获得负值，例如;

    this.margins.top = -50;

这样，PDF的第二页上没有标题。

如果我找到更好的方法来更新这个答案（我不知道是否允许这样做），我已经尝试过使用代码而没有太大的成功。

Answer 2

绘制表格时，只需使用：

startY: doc.internal.getNumberOfPages() > 1 ? doc.autoTableEndPosY() + 20 : 200,

Answer 3

尝试添加CSS类，例如- Thead { 显示：table-header-group } foot脚{ 显示：table-row-group } tr { 分页闯入：避免 }

jsPDF大表，标题在第二页重叠

3 个答案: