Advanced Usage

SVGTable is not overly complex by nature. Its simiplicity allows combining with multiple different SVGs, even SVGTable itself.

tables in a table

You can add another table as you want since it is just a SVG. Here is a basic example.

Header 1Header 2Header3Blue TextOrangeBack,WhiteTextGradient BackGradient Back2Header 1Col SpanRow 1, Cell 1Row SpanmultilinesupportRow 1, Cell 3Row 2, Cell 1Row 2, Cell 3Header 1Header 2Row1, Cell1Row 1, Cell 2Row 1, Cell 3Row 2, Cell 1Row 2, Cell 3header1header2Row1, Cell1Row 1, Cell 2Row 1, Cell 3Row 2, Cell 1Row 2, Cell 3Header 1Header 2Header3Row 1, Cell 1Row 1, Cell 2Row 1, Cell 3Row 2, Cell 1Row 2, Cell 2Row 2, Cell 3Header 1Header 2testRow 1, Cell 2Row 1, Cell 3Row 2, Cell 1Row 2, Cell 3

tables in a table (HTML form)

You can add another table as you want since it is just a SVG. Here is a basic example.

Header 1Header 2Header 3Blue TextOrangeBack,WhiteTextGradient BackGradient Back2Header 1Col SpanRow 1, Cell 1Row SpanmultilinesupportRow 1, Cell 3Row 2, Cell 1Row 2, Cell 3Header 1Header 2Row1, Cell1Row 1, Cell 2Row 1, Cell 3Row 2, Cell 1Row 2, Cell 3header1header2Row1, Cell1Row 1, Cell 2Row 1, Cell 3Row 2, Cell 1Row 2, Cell 3Header 1Header 2Header3Row 1, Cell 1Row 1, Cell 2Row 1, Cell 3Row 2, Cell 1Row 2, Cell 2Row 2, Cell 3Header 1Header 2testRow 1, Cell 2Row 1, Cell 3Row 2, Cell 1Row 2, Cell 3

auto aligned embeded tables

As you see above example, you have to set the table’s size manually. If you want to just add SVGTables in a SVGTable, you can recurrsively add it without setting individual tables. All internal table properties will automatically have 100% of the cell size in the padding area.

Header 1Header 2Header3emptyfilledemptyfilledfilledemptyemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledfilledemptyfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledfilledemptyfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledempty

Automatic height adjustment

You can automatically adjust height by setting height property. Once the height is given, all nested tables are also automatically fit in the cells.

Header 1Header 2Header3emptyfilledemptyfilledfilledemptyemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledfilledemptyfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledfilledemptyfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyfilledemptyfilledemptyfilledemptyfilledfilledemptyemptyfilledemptyfilledfilledemptyemptyfilledempty

Automatic height adjustment (HTML form)

You can automatically adjust height by setting height property. Once the height is given, all nested tables are also automatically fit in the cells.

Header 1Header 2Header 3cell 1cell 2cell 3cell 1cell 2cell 3cell 1cell 2cell 3filledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilledfilled