Search code examples
javascriptnode.jspptxgenjs

How to make a borderless table on pptxgenjs in 2d array slide


I am creating a presentation using pptgenjs however i can't seems to create a table border as i wants it to be.

here is the data that i'm trying to use:

let rows = [
   ["data1","data2"],
   ["data3","data4"],
   ["data5","data6"],
]

here is what i tried so far:

let arrBorder = [null,null,{color:'DA70D6'},null]
slide.addTable(rows,{rowH:1,border:arrborder})

in the method i tried, to make a null on the top, left and right of the table, while the bottom are having a line which resulted in this:

enter image description here

However what i wanted the following:

enter image description here

Any advice on how to make it works?


Solution

  • Based on their table documentation, I believe it goes together like this:

    const col2cellstyle = {border: [null, null, {color:'DA70D6'}, null]};
    const table = rows.map(row => row.map((value, col) => ({
      text: value,
      options: col == 1 ? col2cellstyle : null;
    })));
    slide.addTable(table, {rowH: 1});
    

    The resulting data structure that's fed into .addTable would look like:

    [
      [
        {text: "data1", options: null}, 
        {text: "data2", options: {border: [null, null, {color:'DA70D6'}, null]}},
      ],
      [
        {text: "data3", options: null}, 
        {text: "data4", options: {border: [null, null, {color:'DA70D6'}, null]}},
      ],
      [
        {text: "data5", options: null}, 
        {text: "data6", options: {border: [null, null, {color:'DA70D6'}, null]}},
      ],
    ]