2016-11-07 2 views
1

У меня есть html-таблица с изображениями. Когда я пытался конвертировать в PDF-файлы, только данные поступают. Ядро не отображается в PDF-формате.Как получить изображение строки таблицы в формате PDF с помощью jsPDF?

Как получить таблицы td изображений в формате pdf?

enter image description here

Контракт Название Содержит Checkbox image.But не приходит в 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> 

AutoGenerate стол я добавил изображение:

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

ответ

2

Это несколько громоздко в данный момент. Дорожная карта заключается в том, чтобы поддержать это в будущем. Вот некоторые примеры кода, как это сделать сегодня:.

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

я генерируется таблица, как этот $ ('# oReportContractDetailsByCA') добавить ("" + data.d.results [i] .ID + "" + data.d.results [i] .Title + " elina

+0

@Simon, 6 месяцев назад, вы сказали: «В настоящее время это несколько громоздко. Дорожная карта должна помочь в этом лучше в будущем». Теперь мы в будущем :-) Знаете ли вы, стало ли это проще? – Mawg