HTML table in pdfkit (Expressjs-Nodejs)

Question

I am using pdfkit to generate pdf file and i want to send this pdf file to browser.
My following code is working fine and i am getting one pdf with text.

Answer 1

this worked for me:

artikelList.map(artikel => {
  let yPos = doc.y;
  doc
    .fontSize(8)
    .text(artikel.titel, (x = 50), (y = yPos))
    .text(artikel.menge, (x = 200), (y = yPos))
    .text(`${artikel.spOhne.toFixed(2)}€`, (x = 250), (y = yPos))
    .text(`${(artikel.USt / 100).toFixed(2)}%`, (x = 350), (y = yPos))
    .text(
      `${(artikel.spOhne * (1 + artikel.USt / 100)).toFixed(2)}€`,
      (x = 400),
      (y = yPos)
    )
    .text(
      `${(artikel.menge * artikel.spOhne * (1 + artikel.USt / 100)).toFixed(
        2
      )}€`,
      (x = 475),
      (y = yPos),
      { align: 'right' }
    );
});

literally just fixing the y-position and then moving through the x-positions. I guess with adding rec and stroke it would be pretty straight forward to draw the lines around it.

Produces something that looks like this

Answer 2

function example(){    
var doc = new PDFDocument();

var writeStream = fs.createWriteStream('filename.pdf');
doc.pipe(writeStream);
//line to the middle
doc.lineCap('butt')
  .moveTo(270, 90)
  .lineTo(270, 230)
  .stroke()

row(doc, 90);
row(doc, 110);
row(doc, 130);
row(doc, 150);
row(doc, 170);
row(doc, 190);
row(doc, 210);

textInRowFirst(doc, 'Nombre o razón social', 100);
textInRowFirst(doc, 'RUT', 120);
textInRowFirst(doc, 'Dirección', 140);
textInRowFirst(doc, 'Comuna', 160);
textInRowFirst(doc, 'Ciudad', 180);
textInRowFirst(doc, 'Telefono', 200);
textInRowFirst(doc, 'e-mail', 220);
doc.end();

writeStream.on('finish', function () {
  // do stuff with the PDF file
  return res.status(200).json({
    ok: "ok"
  });

});
}

function textInRowFirst(doc, text, heigth) {
  doc.y = heigth;
  doc.x = 30;
  doc.fillColor('black')
  doc.text(text, {
    paragraphGap: 5,
    indent: 5,
    align: 'justify',
    columns: 1,
  });
  return doc
}


function row(doc, heigth) {
  doc.lineJoin('miter')
    .rect(30, heigth, 500, 20)
    .stroke()
  return doc
}

Click show image result

Answer 3

Well there's no easy to do it directly with PDFKit. You have to implement the table rendering logic yourself. If you wanna do it simply, you just have to realize that tables are just a bunch of rectangles with text into them. This will work with a one-off code. It won't be flexible though.

If you don't mind deviating from PDFKit a little bit, there's a couple of options:

• There's a fork of PDFKit which has tables support. Here's an example of it should be used.
• There's pdfmake which is built on top of PDFKit and supports tables. Pdfmake supports a declarative syntax unlike PDFKit.

And seeing you mention HTML, I would really suggest throw PDFkit out of the door when you have HTML and use phantomjs or wkhtmltopdf, which their job is to render HTML and optionally output PDF and that's what you want. Last time I was looking for a module that handles this well, I found phantom-html-to-pdf.