강현태 / capstone1-medical2

use colSpan to span columns - (colSpan above normal cell)

┌───────────────┐
│ greetings     │
├───────────────┤
│ greetings     │
├───────┬───────┤
│ hello │ howdy │
└───────┴───────┘

      var table = new Table({style:{head:[],border:[]}});

      table.push(
        [{colSpan:2,content:'greetings'}],
        [{colSpan:2,content:'greetings'}],
        ['hello','howdy']
      );

use colSpan to span columns - (colSpan below normal cell)

┌───────┬───────┐
│ hello │ howdy │
├───────┴───────┤
│ greetings     │
├───────────────┤
│ greetings     │
└───────────────┘

      var table = new Table({style:{head:[],border:[]}});

      table.push(
        ['hello','howdy'],
        [{colSpan:2,content:'greetings'}],
        [{colSpan:2,content:'greetings'}]
      );

use rowSpan to span rows - (rowSpan on the left side)

┌───────────┬───────────┬───────┐
│ greetings │           │ hello │
│           │ greetings ├───────┤
│           │           │ howdy │
└───────────┴───────────┴───────┘

      var table = new Table({style:{head:[],border:[]}});

      table.push(
        [{rowSpan:2,content:'greetings'},{rowSpan:2,content:'greetings',vAlign:'center'},'hello'],
        ['howdy']
      );

use rowSpan to span rows - (rowSpan on the right side)

┌───────┬───────────┬───────────┐
│ hello │ greetings │           │
├───────┤           │           │
│ howdy │           │ greetings │
└───────┴───────────┴───────────┘

      var table = new Table({style:{head:[],border:[]}});

      table.push(
        ['hello',{rowSpan:2,content:'greetings'},{rowSpan:2,content:'greetings',vAlign:'bottom'}],
        ['howdy']
      );

mix rowSpan and colSpan together for complex table layouts

┌───────┬─────┬────┐
│ hello │ sup │ hi │
├───────┤     │    │
│ howdy │     │    │
├───┬───┼──┬──┤    │
│ o │ k │  │  │    │
└───┴───┴──┴──┴────┘

      var table = new Table({style:{head:[],border:[]}});

      table.push(
        [{content:'hello',colSpan:2},{rowSpan:2, colSpan:2,content:'sup'},{rowSpan:3,content:'hi'}],
        [{content:'howdy',colSpan:2}],
        ['o','k','','']
      );

multi-line content will flow across rows in rowSpan cells

┌───────┬───────────┬───────────┐
│ hello │ greetings │ greetings │
├───────┤ friends   │ friends   │
│ howdy │           │           │
└───────┴───────────┴───────────┘

      var table = new Table({style:{head:[],border:[]}});

      table.push(
        ['hello',{rowSpan:2,content:'greetings\nfriends'},{rowSpan:2,content:'greetings\nfriends'}],
        ['howdy']
      );

multi-line content will flow across rows in rowSpan cells - (complex layout)

┌───────┬─────┬────┐
│ hello │ sup │ hi │
├───────┤ man │ yo │
│ howdy │ hey │    │
├───┬───┼──┬──┤    │
│ o │ k │  │  │    │
└───┴───┴──┴──┴────┘

      var table = new Table({style:{head:[],border:[]}});

      table.push(
        [{content:'hello',colSpan:2},{rowSpan:2, colSpan:2,content:'sup\nman\nhey'},{rowSpan:3,content:'hi\nyo'}],
        [{content:'howdy',colSpan:2}],
        ['o','k','','']
      );

rowSpan cells can have a staggered layout

┌───┬───┐
│ a │ b │
│   ├───┤
│   │ c │
├───┤   │
│ d │   │
└───┴───┘

      var table = new Table({style:{head:[],border:[]}});

      table.push(
        [{content:'a',rowSpan:2},'b'],
        [{content:'c',rowSpan:2}],
        ['d']
      );

the layout manager automatically create empty cells to fill in the table

┌───┬───┬──┐
│ a │ b │  │
│   ├───┤  │
│   │   │  │
│   ├───┴──┤
│   │ c    │
├───┤      │
│   │      │
└───┴──────┘

      var table = new Table({style:{head:[],border:[]}});

      //notice we only create 3 cells here, but the table ends up having 6.
      table.push(
        [{content:'a',rowSpan:3,colSpan:2},'b'],
        [],
        [{content:'c',rowSpan:2,colSpan:2}],
        []
      );

use table rowHeights option to fix row height. The truncation symbol will be shown on the last line.

┌───────┐
│ hello │
│ hi…   │
└───────┘

      var table = new Table({rowHeights:[2],style:{head:[],border:[]}});

      table.push(['hello\nhi\nsup']);

if colWidths is not specified, the layout manager will automatically widen rows to fit the content

┌─────────────┐
│ hello there │
├──────┬──────┤
│ hi   │ hi   │
└──────┴──────┘

      var table = new Table({style:{head:[],border:[]}});

      table.push(
        [{colSpan:2,content:'hello there'}],
        ['hi', 'hi']
      );

you can specify a column width for only the first row, other rows will be automatically widened to fit content

┌─────────────┐
│ hello there │
├────┬────────┤
│ hi │   hi   │
└────┴────────┘

      var table = new Table({colWidths:[4],style:{head:[],border:[]}});

      table.push(
        [{colSpan:2,content:'hello there'}],
        ['hi',{hAlign:'center',content:'hi'}]
      );

a column with a null column width will be automatically widened to fit content

┌─────────────┐
│ hello there │
├────────┬────┤
│     hi │ hi │
└────────┴────┘

      var table = new Table({colWidths:[null, 4],style:{head:[],border:[]}});

      table.push(
        [{colSpan:2,content:'hello there'}],
        [{hAlign:'right',content:'hi'}, 'hi']
      );

feel free to use colors in your content strings, column widths will be calculated correctly

      var table = new Table({colWidths:[5],style:{head:[],border:[]}});

      table.push([colors.red('hello')]);