Search code examples
javascriptreactjsmeteoramcharts

Uncaught Error: unsupported number: 00940155.184155.1840040


I'm developing a web application using React. I want to export a chart and data to a single PDF page. Trying to do this, I'm getting the following error

pdfmake.js:29058 Uncaught Error: unsupported number: 00940155.184155.1840040
    at t.number (pdfmake.js:29058)
    at r.lineTo (pdfmake.js:37584)
    at d (pdfmake.js:2733)
    at f (pdfmake.js:2601)
    at r.createPdfKitDocument (pdfmake.js:2392)
    at i._createDoc (pdfmake.js:104)
    at i.getBuffer (pdfmake.js:242)
    at i.getDataUrl (pdfmake.js:222)
    at Object.toPDF (export.min.js:1)
    at Object.<anonymous> (TestLineChart.jsx:105)

what is reason for that?

Code is below

TestLineChart.jsx

chart.export.capture({}, function () {
    this.toJPG({}, function (data) {
        let chartHeder = document.getElementById('chartHeder').innerText;

        images.push({
            "text": chartHeder,
            "fontSize": 15
        });

        images.push({
            'image': data,
            "fit": [523.28, 769.89]
        });

        images.push({
            "text": '\n\n',
            "fontSize": 15
        });

        images.push({
            "table": {
                "headerRows": 1,
                "widths": columnStyleArray,
                "body": [ //chart.dataProvider
                        ["DATE VARIANCE", "CURRENT YEAR VARIANCE", "LAST YEAR VARIANCE"],
                        ["5000", "4500", "5100"],
                        ["5000", "4500", "5100"],
                        ["5000", "4500", "5100"],
                        ]
             }
       });

        chart.export.toPDF({
            content: images
        }, function (data) {
            let fileName = chartHeder.split(' /')[0] + '_' + chart.dataProvider[0].date + ' - ' + chart.dataProvider[chart.dataProvider.length - 1].date;
            this.download(data, "application/pdf", fileName + ".pdf");
        });
    });
});

there are line 105 is chart.export.toPDF, I use this example to develop this code.

Here is the jsfiddle


Solution

  • Looking at your jsfiddle, It's funny but your only problem is, In your table your first width value is missing % so change it to "40%"

    Here I updated your jsfiddle

    notice I only changed the table's width property from "widths": ["40", "30%", "30%"] to "widths": ["40%", "30%", "30%"] adding % to the first value.