Tables

Tables are created using the table tag. Tables have two optional attributes that you can set when defining them:

grid (true/false): Define if table borders are visible
widths (numbers): Define the widths of the columns

The grid is turned on by default. If no widths are specified, the columns will be evenly distributed in width.

Example 1

This is an example of a simple table with visible table borders, and whose column widths are 40% and 60% of the page.

You can copy this example into your document as-is.

<table grid="true" widths="40% 60%">
  <head>
    <column>
      <p>Name</p>
    </column>
    <column>
      <p>Affiliation</p>
    </column>
  </head>
  <row>
    <column>
      <p>Luke Skywalker</p>
    </column>
    <column>
      <p>New Jedi Order</p>
    </column>
  </row>
  <row>
    <column>
      <p>Darth Vader</p>
    </column>
    <column>
      <p>The Galactic Empire</p>
    </column>
  </row>
</table>
table-with-borders.jpg

Example 2

This is an example of using the column span attribute to merge the cells of multiple columns in a single row. 

You can copy this example into your document as-is.

<table grid="true" widths="30% 30% 40%">
  <head>
    <column>
      <p>Name</p>
    </column>
    <column>
      <p>Alternate Identity</p>
    </column>
    <column>
      <p>Affiliation</p>
    </column>
  </head>
  <row>
    <column columnSpan="2">
      <p>Luke Skywalker</p>
    </column>
    <column>
      <p>New Jedi Order</p>
    </column>
  </row>
</table>
table-column-span.jpg

Example 3

This is an example of using the data element inside of a table to add rows and columns without explicitly defining them. Commas separate columns and semicolons define the rows. The data element can be mixed with other table elements, like head and row

You can copy this example into your document as-is.

<table>
  <data>
    <b>Operation, Expression; </b>
    Square, $x^2$ (square);
    Cube, $x^3$;
    Multiply, $x * y$;
    Text, <b>This is not math.</b>
  </data>
</table>
table-data.jpg

Example 4

This example uses the values from a comma-separated-value (CSV) file to populate the fields of a table. The file must be included in the resources folder of your project.

You can not copy this example into your document without creating and including a CSV file in your project.

<table>
  <head>
    <column>
      <p>X</p>
    </column>
    <column>
      <p>Y</p>
    </column>
  </head>
  <data src="resources/my_values.csv" />
</table>
table-from-csv.jpg