Matrix Table Layout
The Matrix Table is a layout container used to display multiple visuals and assets within tiles in a tabular construct. The table can be used to display visualizations, dynamic images, text, slicers, buttons, images, and web panels. However, the matrix table is commonly used to create KPI scorecards. Typically, KPIs, mini visuals, and text labels are displayed across several rows, to easily compare these details within a single formatting structure. For instance, the matrix table below compares sales during April, May, and June.
Note: This feature is not available in the Community Edition.
Add a Table
Do either of the following from the Toolbox:
- Click Add Table (red arrow below) to add a table of the default size (3 columns by 3 rows; 9 tiles in total).
- Right-click Add Table and specify the table size by selecting rows and columns (green highlight below).
Then click anywhere on the canvas to place the container there.
Add Assets to the Table
Drag any assets onto the required tile in the table.
Remove Assets from the Table
To move an asset out of the table, simply drag it and place it on the canvas.
To delete an asset that's in a table, right-click on it and click Delete from the context menu.
Edit a Table
To access the Matrix Table's context menu:
- Right-click the borders of the Matrix Table container (green highlight below).
- Right-click a visual inside the Matrix Table. In this case, the context menu is shown inside a Matrix Table sub-menu.
Tip: In addition to the matrix table items, you can also access other items from the context menu. Where the border is selected, this includes the Panel Settings (orange arrow above) which opens the Formatting Panel.
Function |
Description |
---|---|
Insert |
Insert columns before or after, or rows above or below, the current selection. If you have the table selected, the column or row is added before or above the first column or row in the table or after or beneath the last. |
Delete |
Delete selected columns or rows or cell content. |
Tip: You can also resize the table's columns and rows by dragging a row or cell border vertically or horizontally.
Table Settings
When the table container is selected, various formatting options will be enabled from the Component ribbon. As usual, you can edit the panels. You can also adjust the table settings (red highlight below).
To adjust the table settings for all cells in the table, select the table container. To adjust settings for a specified cell within the table, select only the required cell.
- Fill: change the color of the cells.
- Borders: show all or no cell borders, or show borders only at the top, bottom, left, or right of the cell(s).
- Border Color: set the border color.
- Border Thickness: set the border width.
- Padding: increase padding between cell borders.
- Reset Table Formatting: revert to the default table formatting.
Here, the background color was set to light blue, all borders were shown, the border color was set to blue, and the border width and padding were both increased:
Here, only borders at the top of the cells are shown, and padding is disabled:
Here, the border color and width were adjusted only for one cell:
Table at Runtime
The assets in the table behave as usual at runtime. Slicer, and cross-visual interactions are enabled by default, and other functions are available from the context menu as usual.