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

Question

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

如何在pdf中获取表格td图像？

合同标题包含一个复选框图像。但是不是以pdf格式出现的？

我的pdf代码：

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：

<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>

自动生成表我添加了一个图像：

    function GenerateTable(data) {
    document.getElementById('divExport').style.display = "";
    if (i == 0) {
        $('#oReportContractDetailsByCA').append("<tr style='background-color:" + bkColor + ";'><td><img src='../../../_layouts/15/1033/IMAGES/eContracts/checked-checkbox-512.jpg'></img></td></tr>")
    }

Answer 1

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

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");
}