Convert json to pdf using js frameworks

Question

I want to convert json data to a PDF file through client-side Javascript. Could you point me in a useful direction?

For example, I would like to convert this json

{"employees":[ {"firstName":"John", "lastName":"Doe"}, {"firstName":"Anna", "lastName":"Smith"}, {"firstName":"Peter", "lastName":"Jones"} ]} 

In pdf file ...

 Employees FirstName: John LastName :Doe FirstName: Anna LastName :Smith FirstName: Peter LastName :Jones 

Answer 1

You can create a PDF file on the client using jsPDF .

 var employees = [ {"firstName":"John", "lastName":"Doe"}, {"firstName":"Anna", "lastName":"Smith"}, {"firstName":"Peter", "lastName":"Jones"} ]; var doc = new jsPDF(); employees.forEach(function(employee, i){ doc.text(20, 10 + (i * 10), "First Name: " + employee.firstName + "Last Name: " + employee.lastName); }); doc.save('Test.pdf'); 

Answer 2

You can use pdfmake , which support client-side and server-side rendering.

 //import pdfmake import pdfMake from 'pdfmake/build/pdfmake.js'; import pdfFonts from 'pdfmake/build/vfs_fonts.js'; pdfMake.vfs = pdfFonts.pdfMake.vfs; const employees = [ {"firstName":"John", "lastName":"Doe"}, {"firstName":"Anna", "lastName":"Smith"}, {"firstName":"Peter", "lastName":"Jones"} ]; const document = { content: [{text: 'Employees', fontStyle: 15, lineHeight: 2}] } employees.forEach(employee => { document.content.push({ columns: [ { text: 'firstname', width: 60 }, { text: ':', width: 10 }, { text:employee.firstName, width: 50 }, { text: 'lastName', width: 60 }, {text: ':', width: 10 }, { text: employee.lastName, width: 50} ], lineHeight: 2 }); }); pdfMake.createPdf(document).download();