如何使用jsPDF获取PDF格式的表行图像?

时间:2016-11-07 12:25:43

标签: jspdf jspdf-autotable

我有一个带有图像的html表。当我试图转换为PDF时只有数据即将到来。图像不以PDF格式显示。

如何以PDF格式获取表格td图像?

enter image description here

合约标题包含一个复选框图像。但是不是pdf格式?

我的pdf代码:

<a [routerLink]="['user', userId, 'profile'] | localize">{{'USER_PROFILE' | translate}}</a>

<a [routerLink]="['about' | localize]">{{'ABOUT' | translate}}</a>

股利:

function fnExportDIVToPDF() {

     var pdf = new jsPDF('l', 'pt', 'a2');
    pdf.setFontSize(8);
    source = $('#divReport')[0];
    specialElementHandlers = {
   '#bypassme': function (element, renderer) {
    return true
        }
    };
    margins = {
        top: 30, bottom: 40, left: 10, width: 1300};

    pdf.fromHTML(
            source, margins.left, margins.top, {
                'elementHandlers': specialElementHandlers},

    function (dispose) {

        pdf.save('Report.pdf');
    }
    , margins);
}

自动生成表我添加了一张图片:

<div id="divReport">

                        <div width="100%">
                            <p><span id="oHeadingSummary" class="rptheader"></span></p>

                        </div>

                        <table class="table table-striped rpttable" border="1" cellspacing="0" id="oReportContractDetailsByCA" width="100%">
                            <colgroup>...    <col width="10%">
                            </colgroup></table>

1 个答案:

答案 0 :(得分:3)

目前这有点麻烦。该路线图将在未来更好地支持这一点。以下是一些示例代码:#/ p>

https://codepen.io/someatoms/pen/vLYXWB

function generate() {
  var doc = new jsPDF('p', 'pt');

  var elem = document.getElementById('table');
  var imgElements = document.querySelectorAll('#table tbody img');
  var data = doc.autoTableHtmlToJson(elem);
  var images = [];
  var i = 0;
  doc.autoTable(data.columns, data.rows, {
    bodyStyles: {rowHeight: 30},
    drawCell: function(cell, opts) {
      if (opts.column.dataKey === 5) {
        images.push({
          url: imgElements[i].src,
          x: cell.textPos.x,
          y: cell.textPos.y
        });
        i++;
      }
    },
    addPageContent: function() {
      for (var i = 0; i < images.length; i++) {
        doc.addImage(images[i].url, images[i].x, images[i].y, 20, 20);
      }
    }
  });

  doc.save("table.pdf");
}