cách đặt kích thước phông chữ của bảng đã xuất trong jspdf.js?

Tôi đang sử dụng jspdf.debug.js để xuất dữ liệu pdf từ trang html. Đây là chức năng của bộ điều khiển mà tôi đang sử dụng. Tôi đã tạo một chuỗi dưới dạng bảng html mà tôi muốn xuất.cách đặt kích thước phông chữ của bảng đã xuất trong jspdf.js?

$scope.exportReport = function (fileName, fileType) { 
    objReport.count = 0; // for getting all records 
    ReportService.getSaleDetail(objReport).then(function (result) { 
     var strTable = "<table id='tableReport'><tr><td style='width:400px'>Date</td><td style='width:50px'>Order Id</td><td style='width:130px'>Product</td><td style='width:120px'>Gorss Price</td><td style='width:160px'>Currency</td><td style='width:50px'>Order Status</td><td style='width:150px'>Assigned To</td><td style='width:150px'>Assigned User Email</td><td style='width:150px'>Country</td></tr>"; 
     var strRow = ''; 
     if (result.data.totalRecords > 0) { 
      var totalRecords = parseInt(result.data.totalRecords); 
      var saleDataJson = result.data.saleDetail; 
      for (var i = 0; i < totalRecords; i++) { 
       strRow = '<tr><td>' + saleDataJson[i].date + '</td>' + '<td>' + saleDataJson[i].orderId + '</td>' + '<td>' + saleDataJson[i].product + '</td>' + '<td>' + (1 * saleDataJson[i].grossPrice).toFixed(2) + '</td>' + '<td>' + saleDataJson[i].currency + '</td>' + '<td>' + saleDataJson[i].orderStatus + '</td>' + '<td>' + saleDataJson[i].assignedTo + '</td><td>' + saleDataJson[i].assignedUserEmail + '</td><td>' + saleDataJson[i].country + '</td></tr>'; 
       strTable += strRow; 
      } 
      strTable += "</table>"; 
     } 
     if (fileType === 'pdf') { 
       var pdf = new jsPDF('p', 'pt', 'letter') // jsPDF(orientation, unit, format) 
         , source = strTable 
         , specialElementHandlers = { 
          // element with id of "bypass" - jQuery style selector 
          '#bypassme': function (element, renderer) { 
           // true = "handled elsewhere, bypass text extraction" 
           return true; 
          } 
         }, 
       margins = { 
        top: 30, 
        bottom: 40, 
        left: 35, 
        width: 600 
       }; 

       pdf.setFontSize(12); 
       pdf.text(200, 30, fileName); 
       pdf.setFontSize(8); 
       pdf.setFontStyle('italic'); 
       pdf.text(420, 35, 'Total Records : ' + totalRecords); 
       pdf.fromHTML(
         source // HTML string or DOM elem ref. 
         , margins.left // x coord 
         , margins.top // y coord 
         , { 
          'width': margins.width // max width of content on PDF 
          , 'elementHandlers': specialElementHandlers 
         }, 
       function (dispose) { 
        // dispose: object with X, Y of the last line add to the PDF 
        //   this allow the insertion of new lines after html 
        pdf.save(fileName + '.pdf'); 
       }, 
         margins 
         ) 
      } 

     }); 

    };

và phương pháp này được xuất khẩu tập tin pdf như thế này

tôi đã cố gắng phong cách với tang nhưng nó không làm việc Làm thế nào có thể làm giảm kích thước phông chữ để tôi có thể xuất file pdf động ?

Nguồn

2015-05-19 Sunil Garg

pdf.setFont("helvetica"); 
pdf.setFontType("bold"); 
pdf.setFontSize(9);

Nguồn

2015-05-19 07:59:20

này không làm việc cho dữ liệu bảng –

này làm việc cho tôi:

table.style.fontSize = '5px';

Nguồn

2016-07-29 11:36:37 mixo

Điều này dường như làm việc. Nó cũng có thể được thực hiện trực tiếp trong HTML với kiểu dáng nội tuyến, tức là '

' –

có vẻ như "pdf.fromHTML" trên bảng bỏ qua phong cách, hoặc thậm chí thiết lập jsPdf, chẳng hạn như "pdf.setFont (" helvetica ");" v.v.

để bạn có thể thực hiện thay đổi trên tệp "jspdf.debug.js" gốc:

a. mặc định "autoSize" là sai, vì vậy bạn có thể thay đổi nó.

b. fontSize mặc định là 12 - bạn nên gửi giá trị nhỏ hơn (thêm giá trị của bạn vào đối số cuối cùng).

/*** TABLE RENDERING ***/ 
} else if (cn.nodeName === "TABLE") { 
    table2json = tableToJson(cn, renderer); 
    renderer.y += 10; 
    renderer.pdf.table(renderer.x, renderer.y, table2json.rows, table2json.headers, { 
      autoSize : true, 
      printHeaders : true, 
      margins : renderer.pdf.margins_doc, 
      fontSize : 9 
     });

Nguồn

2016-08-04 18:00:27 Noshe

Hãy thử AutoTable - Bảng plugin cho jsPDF

<a class="pull-right btn btn-warning btn-large" href="#" onclick="generate();"><i class="fa fa-file-excel-o"></i> PDF Data</a> 
<table class="table table-bordered table-striped" id="basic-table"> 

<script src='https://cdn.rawgit.com/simonbengtsson/jsPDF/requirejs-fix-dist/dist/jspdf.debug.js'></script> 
<script src='https://unpkg.com/[email protected]'></script> 
<script src="<?php echo base_url();?>assets/bower_components/jspdf/dist/index.js"></script> 
<script> 


function generate() { 

    var doc = new jsPDF('l', 'pt', 'a4'); 
    doc.setFontSize(12); 

    var res = doc.autoTableHtmlToJson(document.getElementById("basic-table")); 
    doc.autoTable(res.columns, res.data, {margin: {top: 80}}); 

    var header = function(data) { 
    doc.setFontSize(18); 
    doc.setTextColor(40); 
    doc.setFontStyle('normal'); 
    //doc.addImage(headerImgData, 'JPEG', data.settings.margin.left, 20, 50, 50); 
    doc.text("Country List", data.settings.margin.left, 50); 
    }; 

    var options = { 
    beforePageContent: header, 
    margin: { 
     top: 80 
    }, 

    startY: doc.autoTableEndPosY() + 20 
    }; 

    doc.autoTable(res.columns, res.data, options); 

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



</script>

Nguồn

2018-03-10 04:25:50

Các vấn đề liên quan

cách đặt kích thước phông chữ của bảng đã xuất trong jspdf.js?

Trả lời

Các vấn đề liên quan