tables

[faridnsh]

I have an idea for it. We can pass a two-dimensional array of texts, to a method with presentation options like the following:

doc.table([
  ["cell11"],["cell21"],["cell31"],
  ["cell12"],["cell22"],["cell32"],
  ["cell13"],["cell23"],["cell33"]
  ],{
    width:20,
    height:40,
    x:30,
    y:40
});

Then in the module we make rectangles and texts for each cell.

[keyboard4444]

I work as programmer to do alot of customization for business. It will involve creating report in PDF format.
This thing already good but it need something to draw a table.

                            Well, it is not draw a table but more specifically draw a row (with several column inside it)
                            Then from there, looping the row result to create a table. This is the 'practical' use

                            so usually the code will end up like this
                            doc.setColumn('no', '1')
                            doc.setColumn('name', 'Bomb') 
                            doc.setColumn('price', '10.01')
                            doc.drawRow()

[wiz]

Is there actual PDF markup to render a table, or is it just lots of lines?

[ForbesLindesay]

+1000 for this. Anyone know the answer to @jmaurice's question?

P.S. A two dimensional array would look like:

doc.table([
  ["cell11","cell21","cell31"],
  ["cell12","cell22","cell32"],
  ["cell13","cell23","cell33"]
  ],{
    width:20,
    height:40,
    x:30,
    y:40
});

[giuseppe-santoro]

Hi people!
I'm developing a function to generate tables, in general my idea is:

doc.table data options

Where data is an array of rows and each row is rappresented as an object.
For example, suppose you want to create an invoice, data should be something like this:

data =
    [
        { code: '0001', name: 'Black table', quantity: '10', price: '$ 19.20' }
        { code: '0005', name: 'White table', quantity: '8',  price: '$ 19.20' }
        { code: '0012', name: 'Red chair',   quantity: '40', price: '$ 12.00' }
    ]

In my opinion, this strategy is more useful than a two dimensional array when you get the data from a database.

The second parameter, options, contains a set of options that modify the rendering of the table.
An example of options should be:

options =

    columns:
    [
        { id: 'code',     width: 10, name: 'Code' }
        { id: 'name',     width: 40, name: 'Name' }
        { id: 'quantity', width: 25, name: 'Quantity' }
        { id: 'price',    width: 25, name: 'Price' }
    ]

    margins:
        left: 20
        top: 40
        right: 20
        bottom: 0

    padding:
        left: 10
        top: 10
        right: 10
        bottom: 10

options.columns.id is the is ID used to map the column with the corresponding data.
options.columns.width is the percentage of width that the column occupies; this meas that the sum of all width must be 100.
options.columns.name is the name of the column that will be render as an header of the table.
options.margins is the table margin, so it is the distance from the page borders to the table borders.
options.padding is the cell padding, so it is the distance from the cell borders to the text in the cell.

What do you think about?
any suggestion is appreciated!

[alvassin]

+1

[mrjonny2]

Looks great! Can't wait to try it.

[johntom]

+1 This would be great.

[alexvdev]

Hi guys, I'd like to discuss table creation. @giuseppe-santoro made a sample 8 months ago, thanks him a lot. I think, this feature should be able to take parameters which can be set by html at some html table and generate pdf table as close as possible to source html table formatting. Like wkhtmltopdf does. Looking through the specifications, I found in pdf 1.4 mentioning about tables (9.7.4 > Block-Level Structure Elements > Table Elements). What do you think about implementation? What kind of API will be useful to generate tables?

[giuseppe-santoro]

Hi all, when 9 months ago I have done the sample, I also started to implement it in a fork found here: https://github.com/giuseppe-santoro/pdfkit/blob/master/js/mixins/tables.js.
Since there are some bugs in it I never asked a pull request.
Unfortunatelly now I have no time to work on this but if you want you can take advantage from the code in my fork.
I really like this project and I hope I can contribute in it in the future.

[MrScruffyish]

+1
What is the status for this?

[giuseppe-santoro]

it works pretty well, but it contains some bugs so it is not suitable for production use

[mscdex]

+1000

[diogoAntunes]

Please add this to pdfkit! I need to insert a table in the pdf and i have no ideia how

[aszharite]

@giuseppe-santoro have you made any progress with it? could you specify some specifications as in how you thought an example of table. i really need this and i might try to work out the bugs and fix it but i`ll need your base concept for direction.

[giuseppe-santoro]

Hi @aszharite, sorry for the late replay...
As you can see in table.cooffe, I have created a new mixin for tables.
Basically the core function is 'table' that render the table. It render the header row and than all the body rows according to options. The options format is the format I wrote in previous comment.
At the beginning of the file there are some simple TODOs to improve the code but the big bug is the rendering of the table over multiple pages.
Consider that PDFkit is a low-level library (you can specify the exact position of any element) and you don't have e real concept of flow (like HTML) instead a table is an high-level element that need a flow.
So this is my question: how can we render a high-level element inside a page that use a low-level library?