Tables
Learn how to create and configure a table in Mappica.
Creating Tables
You can create tables by clicking Insert in the Toolbar and then dragging a new table onto the canvas.
Click on any table element on the canvas to select it. Like other elements, tables are highlighted in blue under the Layers tab once they have been selected. Once selected, a table can be customized using the Table tab in the right panel of the page, where the following functionality is available:
Setup
In the Setup section, under the Table tab, you can assign the following properties:
- The name will be used to reference it in the Layers tab and on the canvas.
- The top, right, bottom, and left Margin that will be added between the table and the edge of its container.
Connecting to Datasets
In the Dataset section, under the Table tab, select a dataset that contains the data that you wish to display on the table. In order to add a dataset to a table element, you must first add a dataset to your project. This can be done by selecting New Dataset in the Project tab.
If you are on the Pro plan, you can upload your own files (in csv format) to use as datasets, by clicking New Dataset and then Upload Dataset.
After you have selected a dataset, you can optionally enable the Prefilter Dataset switch, which lets you filter the data that is supplied to the table. The filter is a "prefilter" because it is applied before the visualization is generated; end users are unable to adjust the filter dynamically.
You have the option to Enable Aggregation, which aggregates data in the table based on the chosen Category Field(s). One table row is displayed for each unique Category Field value (or, in the case of multiple Category Fields, each unique combination of Category Field values). Corresponding values in the Series Fields of the table are then combined by either summing or averaging the values. For further information, see Aggregation in Tables.
When table aggregation is not enabled, every dataset record (row) will be displayed as a row in the table.
Adding Columns
In the lower half of the Dataset section, you can select the dataset columns that should be displayed as table columns. Two types of columns can be selected:
- Category Fields are dataset fields that categorize or organize the data, such as a country or product type. These are displayed as the initial column(s) in your table.
- Series Fields are dataset fields that contain numeric values, such as GDP or sales, tied to each category. These will appear after any Category Fields in your table. Only numeric (number, currency, percent, or measurement) fields can be selected and values in these fields can aggregate when aggregation is enabled.
The table shows tourism growth in Iceland and the effects of the Covid pandemic. Nationality is the Category Field and years are Series Fields. Cell colors are formatted with the "pill" color style and a line chart displays long-term trends.
Connecting to Filters
You can establish connections to filter elements under the Table tab, in the Connections section, by making a selection under Filter.
Filter elements display values from a specified Filter Field, in the form of checkboxes, dropdown menu items, or (for numeric filtering) slider values. A given table can be connected to one or more filters, and the same filter can be connected to multiple tables or other elements. Once connected to a table, a filter element will dynamically control the dataset records passed to the table element, based on user selections made on the filter.
In this table of monthly temperatures, cell colors are being formatted to create a heat map. A filter element, displayed as checkboxes, allows users to choose between 2023 and historic data.
Connecting to Selectors
You can connect to a selector element under the Table tab, in the Connections section, under Selector.
Selector elements control which Series Fields are displayed in connected tables and other connected elements that use a wide data format. Selectors can be displayed as checkboxes, dropdowns, or legends. While a table can be connected to only one selector, a single selector can be connected to multiple tables or other elements that use series fields. Once connected, the selector element dynamically controls the dataset fields (columns) passed to the map as series fields based on user selections.
Sorting
In the Sort section, choose which column should be used to sort the table when the visualization first loads. The Sort By dropdown includes a "Default" option which sorts the table in the order that dataset records (rows) are added.
The Allow User Sorting option lets the end user click on table column headings to change how the table is sorted.
Colors
Under the Table tab, in the Color section, you can choose to assign colors to your table's cells, rows, or columns. You can find a comprehensive guide to setting up table colors on the Colors page.
Settings
In the Settings section, under the Table tab, the following options are available:
- Rows Per Page lets you set the number of table rows, excluding the header row, before the table paginates. When pagination is required (i.e. there is more than one page of table results), pagination controls appear above the table on the right-hand side.
- Add Row Number, when enabled, adds an extra column on the left of the table, indicating the row number.
- Add Search Field, when enabled, displays a search input above the table on the left-hand side.
- Minimum Row Height ensures that all rows have a particular minimum height, which can be helpful if you want consistent row heights even when displaying content of varying length in your table. If left unset, this defaults to 40px.
- Cell Padding is the vertical and horizontal padding added to each cell, including the header row. For Pro users, default cell padding can be set in the Theme page in the dashboard.
- Customize Columns, when enabled, lets you specify a width and alignment for each column in the table. When left as auto, a column's width automatically fills the available space. On columns with embedded charts, a specific width in pixels must be set. When there is insufficient space to display the columns, given the specified column widths, the table can be scrolled horizontally by the user.
Try leaving auto width on your Category Field while setting particular widths, in pixels, for the Series Fields. This allows your table to adapt to changes in the width of the visualization container, with the Category Field width varying dynamically.
Embedding Charts
In the Embedded Chart section, you can add charts to your table. These appear on the right-hand side of the table, after any Series Fields.
Begin by selecting Add Chart, which adds a new column to your table where a chart will be placed in every row. You can select a Heading, which will appear in the header row for the column. Under Chart Type you can choose to display "line", "bar", or "column" charts. If you select "line" then you can also select a Curve, which is set to "linear" by default.
Next, select the Columns in your dataset that should be used to construct the chart values. Each column will be treated as a separate data point, where the heading of the selected column is plotted on the independent axis and the row value is plotted against the dependent axis.
By default, headings of the selected columns are treated as "text," so they are added to the chart in alphabetical order. By changing the Column Heading Type you can also choose to treat the column headings as "numbers" or "dates" (specifically years), which in the case of line charts will space out independent axis values accordingly.
You can choose a Margin, which determines the spacing around the chart.
You can specify the main color for your chart, which is either a Line Color, a Bar Color, or a Column Color, depending on the chosen chart type.
You can specify a Domain Minimum and Domain Maximum, which set the minimum and maximum values in the dependent axis of the chart. If the minimum value is left as auto, 0 is used by default. If the maximum value is left as auto, the largest value in all of the selected columns is used by default.
If you selected "line" as the chart type, you can enable Show Start Dot, Show End Dot, Show Start Label, and Show End Label. These options add annotations at either end of the line. If some end labels are cutting off at either the top or bottom of the chart, you can choose to Edit Label Y Position and then specify the following:
- The Min. Y Value for start and end labels. If a label's corresponding value is lower than the minimum value, the label will be positioned at this value.
- The Max. Y Value for start and end labels. If a label's corresponding value is greater than this value, the label will be positioned at this value.
If you add labels to a line chart that is embedded in a table, you will typically need to add margin space on the left or right of the chart to provide space for the labels. Do this by adding Margin to the chart.
You can also enable Add Filled Area if you selected "line" as the chart type, which displays a filled area underneath the line. The color of the filled area is always the same as the line color; you can specify a desired Opacity for this filled area.
You can also Enable Annotations if you selected "bar" or "column" as the chart type. This option displays the value of each bar or column, either inside the bar/column or, if Outside Annotations is enabled, outside of the bar/column. You can also specify a Hidden Range. All values inside the range will be hidden, which can be helpful either if you wish to highlight only certain values, or if you are displaying annotations inside bars and some of the bars are too small to display the annotation.
