16

I'm using pdfmake. I want to format a document and they have good examples on github and in their playground but I was wondering if they featured all capabilities therein. I get the feeling that their may be additional properties like switching fonts, adding different style elements or underlining - things not expressly shared in the examples. Maybe what you see is what you get and that is all but I went over the github page pretty throughly and did not find a more detailed list of capabilities. It seems hella similar to html but it doesn't seem to have the same styling capabilities of html/css, if there is something more could someone please point it out.

rashadb
  • 2,515
  • 4
  • 32
  • 57

3 Answers3

19

Here you go.. At least, uncommented below styles are supported. I tried it myself.

['font',
'fontSize',
'bold',
'italics',
'alignment',
'color',
'columnGap',
'fillColor',
'decoration',
'decorationStyle',
'decorationColor',
'background',
'lineHeight'
//'tableCellPadding'
// 'cellBorder',
// 'headerCellBorder',
// 'oddRowCellBorder',
// 'evenRowCellBorder',
// 'tableBorder'
]

You could use the above styles, as below.

var dd = {
    content: [
        { 
            text: 'This is a header, using header style', 
            style: 'header' 
        }
    ],
    styles: {
        header: {
            fontSize: 18,
            bold: true,
            background: '#ff1'
        }
    }
}
iSomniac
  • 206
  • 2
  • 4
0

You can use margin also as shown below.

// margin: [left, top, right, bottom]
{ text: 'sample', margin: [ 5, 2, 10, 20 ] },

// margin: [horizontal, vertical]
{ text: 'another text', margin: [5, 2] },

// margin: equalLeftTopRightBottom
{ text: 'last one', margin: 5 }

It is from the docs Here.

Suraj Kumar
  • 5,547
  • 8
  • 20
  • 42
Romo
  • 1
0

Update: 27/5/2020 from Github's anwer

Extending @Romo 's answer:

[
'font',
'fontSize',
'bold',
'italics',
'alignment',
'color',
'columnGap',
'fillColor',
'decoration',
'decorationStyle',
'decorationColor',
'background',
'lineHeight'
'listType' // <=== Added  
]

It accepts several options:

'none', 'upper-roman', 'circle', 'square'

Despertaweb
  • 1,672
  • 21
  • 29