データテーブルでPDFのフォントサイズを変更するにはどうすればよいですか？

Question

私はデータテーブルを持っており、印刷ボタンとPDFボタンがあります。 印刷ページではフォントサイズを変更できますが、pdfファイルを書き出している間はフォントサイズを変更できません。

{ 
     extend: 'pdfHtml5', 
     text: 'Save PDF', 
     exportOptions: { 
      modifier: { 
       page: 'current' 
      } 
     }, 
     header: true, 
     title: 'My Table Title', 
     orientation: 'landscape' 
    }, 
    { 
     extend: 'print', 
     text: 'Print', 
      customize: function (win) { 
       $(win.document.body) 
        .css('font-size', '15pt') 


       $(win.document.body).find('table') 
        .addClass('compact') 
        .css('font-size', '8pt'); 
      }, 
      header: false, 
      title: '', 
      orientation: 'landscape' 
    }, 

お手伝いできますか？

Answer 1

あなたがhtml5.jsのSRCを見れば、それはデフォルトのオブジェクトリテラルdoc保持デフォルト設定を作成します。

var doc = { 
    pageSize: config.pageSize, 
    pageOrientation: config.orientation, 
    content: [ 
     { 
      table: { 
       headerRows: 1, 
       body: rows 
      }, 
      layout: 'noBorders' 
     } 
    ], 
    styles: { 
     tableHeader: { 
      bold: true, 
      fontSize: 11, 
      color: 'white', 
      fillColor: '#2d4154', 
      alignment: 'center' 
     }, 
     tableBodyEven: {}, 
     tableBodyOdd: { 
      fillColor: '#f3f3f3' 
     }, 
     tableFooter: { 
      bold: true, 
      fontSize: 11, 
      color: 'white', 
      fillColor: '#2d4154' 
     }, 
     title: { 
      alignment: 'center', 
      fontSize: 15 
     }, 
     message: {} 
    }, 
    defaultStyle: { 
     fontSize: 10 
    } 
}; 

あなたはそれらのデフォルト設定を変更するcustomizeコールバックを使用することができます。

{ 
    extend: 'pdfHtml5', 
    text: 'Save PDF', 
    exportOptions: { 
     modifier: { 
     page: 'current' 
     } 
    }, 
    header: true, 
    title: 'My Table Title', 
    orientation: 'landscape', 
    customize: function(doc) { 
     doc.defaultStyle.fontSize = 16; //<-- set fontsize to 16 instead of 10 
    } 
}, 

---

ヘッダーのフォントサイズを変更する：

doc.styles.tableHeader.fontSize = 30  

https://jsfiddle.net/2nwqa2jk/12/

変更揃え、すべてのヘッダに設定し、中心、すべての列のすべてのフッター：

doc.defaultStyle.alignment = 'center' 

https://jsfiddle.net/2nwqa2jk/13/