Export PDF with different Font not finding new font

JLegault

Link to test case: Was unable to re-create un live.datatables.net
Debugger code (debug.datatables.net): ipagad
Error messages shown: Uncaught File 'CourierPrime-Regular.ttf' not found in virtual file system
Description of problem:

I am unable to create html5 buttons on live.datatables.net, but I may just be doing something wrong there.

My main issue is I cannot change the font family that the PDF export is using.

Within my DataTable Creation:

 {
                extend: 'pdfHtml5',
                text: '<i class="far fa-file-pdf fa-lg text-primary"></i>',
                titleAttr: 'Export to PDF',
                className: 'btn-light',
                exportOptions: {
                    columns: [7, 5, 6, 1, 2, 0, 3, 4],
                    orthogonal: 'export',
                    modifier: {
                        selected: false
                    }
                },
                customize: function(doc){
                    doc.defaultStyle.font = 'Courier'
                }
            }

Run at window load:

pdfMake.fonts = {
    Courier: {
        normal: 'CourierPrime-Regular.ttf',
        bold: 'CourierPrime-Bold.ttf',
        italics: 'CourierPrime-Italic.ttf',
        bolditalics: 'CourierPrime-BoldItalic.ttf'
    },
    Roboto: {
        normal: 'Roboto-Regular.ttf',
        bold: 'Roboto-Medium.ttf',
        italics: 'Roboto-Italic.ttf',
        bolditalics: 'Roboto-MediumItalic.ttf'
    }
}

My vfs_fonts.js file:

this.pdfMake = this.pdfMake || {}; this.pdfMake.vfs = {
  "CourierPrime-Bold.ttf": "AAEAAAAQAQAABAAAR0RFRgRvCGUAAQx8AAAAPEdTVUL+f/UDAAEMuAAAA85PUy8ycfS...",
  "CourierPrime-BoldItalic.ttf": "AAEAAAAQAQAABAAAR0RFRgRuBqoAASZ8AAAANEdTVUKLPZ4SAAEmsAAAB5ZPU...",
  "CourierPrime-Italic.ttf": "AAEAAAAQAQAABAAAR0RFRgRuBqoAASMEAAAANEdTVUKLPZ4SAAEjOAAAB5ZPUy8yc...",
  "CourierPrime-Regular.ttf": "AAEAAAAQAQAABAAAR0RFRgRvCHsAAQYUAAAAPEdTVUL+f/UDAAEGUAAAA85PUy8y...",
  "Roboto-Italic.ttf": "AAEAAAARAQAABAAQR0RFRqNLn+AAAd9EAAACWEdQT1PBrAqiAAHhnAAAZdhHU1VCgv9Z+gA...",
  "Roboto-Medium.ttf": "AAEAAAARAQAABAAQR0RFRqNLn+AAAcmUAAACWEdQT1MwpMVlAAHL7AAAZgxHU1VCgv9Z+gA...",
  "Roboto-MediumItalic.ttf": "AAEAAAARAQAABAAQR0RFRqNLn+AAAd/MAAACWEdQT1MwpMVlAAHiJAAAZgxHU1VCg...",
  "Roboto-Regular.ttf": "AAEAAAARAQAABAAQR0RFRqNLn+AAAclUAAACWEdQT1PBrAqiAAHLrAAAZdhHU1VCgv9Z+g...",
  "sampleImage.jpg": "/9j/4RC5RXhpZgAATU0AKgAAAAgABwESAAMAAAABAAEAAAEaAAUAAAABAAAAYgEbAAUAAAABA..."
};

I know this isn't exactly a DataTables related issue, more a pdfmake issue, but I followed all the steps found here and I'm still getting the error shown above.

colin

This thread should help, it's asking the same thing.

Cheers,

Colin

JLegault

That thread seems to highlight the issue that arises when vfs_fonts.js is included before pdfmake, my includes do not do this.

<script type="text/javascript" src="common/js/min/pdfmake.min.js?r=<?=$vrs?>"></script>
<script type="text/javascript" src="common/js/min/vfs_fonts.js?r=<?=$vrs?>"></script>

I am trying to add an additional font family to the pdfmake options, but it is not applying.

Is there anywhere in the DataTables library where it might be over-writing my font addition? Based on pdfmake's documentation I think I should have a valid Courier font option but DataTables won't export it.

allan

The only thing I can thing of is that pdfMake might point to a different instance? If you run $.fn.DataTable.Buttons.pdfMake().vfs on your console, does it show Courier there?

Failing that, we'd need a link to a test case.

Allan

JLegault

Yes!

Running $.fn.DataTable.Buttons.pdfMake().vfs gave me only the Roboto that automatically comes with pdfmake.

I swapped the order of pdfmake and DataTables in my headers so that my vfs_fonts came after the DataTables js file:

<script type="text/javascript" src="common/js/min/datatables.min.js?r=<?=$vrs?>"></script>
<script type="text/javascript" src="common/js/min/pdfmake.min.js?r=<?=$vrs?>"></script>
<script type="text/javascript" src="common/js/min/vfs_fonts.js?r=<?=$vrs?>"></script>

My guess is somewhere within the datatables min file it is re-defining the pdfmake.fonts object; not an issue just something to note for anyone else trying to customize pdfmake font family.