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.

Pro

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.

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.

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

In tables, you can choose to assign colors to cells, rows, or columns.

Cells: select this option to assign colors based on cell values in specified column(s). You can create one Color Scheme for your entire table, or multiple schemes if cells in some columns should follow a different color scheme to cells in other columns. Within each scheme, assign the following:

  • Color Format: assign colors to either the "Background", "Text", or a "Pill."
  • Color Fields: colors will be assigned to fields you select here. Once one column has been added, you can only select other fields of the same type. If you select a field that is not displayed in the table, you will need to add it (in the Dataset section of the right panel).
  • If the selected Color Fields are text fields, colors can be assigned categorically to each unique text value across all of the selected fields.
  • If the selected Color Fields are numeric (number, percent, currency, or measurement) fields, colors are assigned continuously and you can specify a Color Gradient, Domain, and Color Scale (see the Continuous Colors section).

Rows: choose this option to assign colors to the background of an entire row based on a specified Color Field. This can be either a text field (in which case colors are assigned categorically) or a numeric field (in which case colors are assigned continuously).

Columns: select this option to assign colors to the column header of each series field. The Color Format allows these colors to be displayed either as a "Background" or "Top Border." If a Selector element is connected to the table, it will display the assigned column colors, assuming color formatting is enabled and no other connected elements have precedence in assigning colors.

If you wish to turn off color formatting in a table, return to the default color assignment (cells) and remove any existing color schemes.

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.
Tip

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.
Tip

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.