Search code examples
javascriptreactjspdfmake

all column not display properly in the dynamic table of pdfMake in react

I made a dynamic table in pdf make. Everything works fine, data comes from the backend and is integrated in the pdf make, but when I downloaded the PDF, some of the columns is missing and some of the column data were showing partially. Let me know what I am doing wrong.



var dd = {
    content: [
        {
            style: 'tableExample',
            table: {
                body: [
                    ['ID', 'Name', 'Amount', 'Arrival', 'Checkout', 'TotalTime','phoneNumber','extendedTime']
                ]
            }
        },

    ],
    

}

export const BookingPDFData = (data) => {

    for (let i = 0; i < data.length; i++) {
        let values = Object.values(data[i]);
        dd.content[1].table.body.push(values);
    }

    return dd

}

enter image description here

Solution

  • Might be it is due to the size of your content. Size of your content is bigger to fit in portrait, if you will change the pageOrientation to landscape then it may be fit in the page. You can do it as follow:

      pageSize: 'A4',
  pageOrientation: 'landscape',

    If this is not the case then try to adjust fontsize of your columns.