'How to draw a rectangle in a column in jsPDF autotable?

I am using Quasar and Electron and producing PDFs with jsPDF and also using autotable. Love it so far, gives me a lot of control.

I need to place a box inside a cell/row. I can get a box to appear on the PDF but sticking it into the needed cell is eluding me. I've been googling and don't really understand all the details.

As you can see the little black box is on the top left, and I need a box inside each column where I've drawn the little red boxes.

does the data.row.index correspond to the 0 columns? It needs to skip the first few rows that are just rowSpan for the title areas. I do not have column keys defined... is that necessary? I've been looking at the autotable examples and trying to understand the details but the documentation isn't as elaborate as needed by a newbie such as myself.

My data is pulled from an array that's built from a database.

I will continue to Google and see if I can figure it out but would love help. Thanks.

this.doc.autoTable({ 
  head: headers, 
  body: this.tableRows,
  theme: 'plain',
  didDrawCell: (data) => {
    if (data.row.index === 0 && data.row.section === 'body') {
       this.doc.rect(20, 20, 3, 3, 'F') // empty square
      }
    }
  })

enter image description here



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source