如何在datatables中更改导出PDF的字体大小？

Question

如何在datatables中更改导出PDF的字体大小？

16

我有一个数据表格和打印按钮以及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'
     },

你能帮我吗？

- mrcherie

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- davidkonrad · Accepted Answer

如果你查看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/