Introduction
Table visualization is an essential part of any dashboard or data app; tables allow users to see a detailed view of the data and to get to the bottom of insights findings.
With sparklines and other mini-charts table can also visualize important KPIs for different entities and allow users to compare the performance of the different entities.
Here's a concise overview of the value of table visualization in data analytics:
Organized data presentation: Tables structure information in rows and columns for easy scanning
Quick data comparison: Allows side-by-side comparison of multiple data points
Precise value display: Shows exact numeric values without approximation
Handling large datasets: Can display many data points compactly
Sorting and filtering: Enables interactive exploration of data
Highlighting patterns: Can use color coding or conditional formatting to emphasize trends
Versatility: Suitable for various data types (numeric, categorical, text)
Familiarity: Most users are comfortable with tabular formats
Column Types
Dimension
Dimension columns are fields that set the details level of the data in the table.
Dimension columns are using fields as they appear in the data source.Dimension Settings
Custom label- define the label for a dimension by either entering a manual value or by using a variable for a dynamic label.
Format type- define the display format for the values in the dimension.
Visual representation- define the visual display of the dimensions by selecting one of these options:
Text- showing the values in the dimensions as they are.
HTML- customize the look and feel of values by using an HTML code loaded in another field.
Link- The dimension is a string link to another website page. You can define the label either manually or using another field.
Image- show a picture. The dimension is a string that is a link to an image.
The image below shows the four different representations of the same field.
Show null values- if checked, null values in the dimension will be presented in the table.
Hide column- the dimension will be hidden from users but part of the query and the table structure.
back to the top ↑
Measure
Measures columns show the results of any calculation; the result can be either numeric or text.
Measure Settings
Custom label- You can define the label for a dimension by entering a manual value or using a variable for a dynamic label.
Format- select the format for the measure display
Visual representation- define the visual display of the measure, selecting one of these options :
Number - show the measured value as it is
Mini chart(sparkline)- select an additional dimension to split the result and show it as a chart.
If you would like to learn more about mini charts, you can check this article.Progress Bar- show the measure values with a bar.
The range to the progress bar can be set dynamically or manually.
Dynamically, we will calculate the min and max values according to the values of the measure in all rows in the table.Image- Show the measure results as an image, which is only relevant for string measures.
Icon- show an Icon near the measure.
The image below shows the different display options for a measure.
Hide column- the measure will be hidden from users but part of the query and the table structure.
Advanced calculation: Perform more advanced calculations, such as running totals, period-over-period calculations, nested calculations, and more.
If you would like to learn more about all the options, you can check this article.
back to the top ↑
Action Button
The action button column is usually used as part of a writeback flow.
The action button is used to map the row values into variables that are used in the writeback action.
There are several settings for the action button column.
Label type-
Simple- a simple text object to define the action button label. The label is identical in all rows.
Advanced- Define the button label as a combination of prefixes and suffixes with a column value. The label is dynamic, and each row has a different label.
Map variables- map column value to variables.
Data Tab Settings
Sorting
Set the sorting order of the table and enable or disable dynamic sorting.
Disable interactive sorting- If the checkbox is checked, the end user won't be able to change the table sorting by double-clicking on any column.
Sort by measure- an option to add a measure to control the table sorting.
The measure won't be displayed in the table.Sorting order: Set the sorting order by moving column chips to the top of the order. You can also control individual column sorting by clicking on the arrow icon.
back to the top ↑
Totals
Show and Hide the total row and display the table's record count.
The image below shows a table with enabled the total and record count switches.
* record count isn't supported in pivot table.
Style Tab Settings
Set the type of table and style the entire table and individual columns.
Table Type
Select the table type out of these options:
Straight table
Hierarchical table
Pivot table
* Some of the features in the table are only relevant to straight table.
back to the top ↑
General Settings
Conditional coloring- define rules to color a row or a cell.
Below is an example of a dimension rule.
The image below shows a measure rule.
In the measures rule, the value can be compared to a variable's manual value.
Using a variable allows end-users to control the cell coloring.
The image below shows the table after the rules are applied.
Font- set the font type and size of the table rows.
Background- set the background for the rows.
There are two options:
- Single- Colors all rows the same color.
- Zebra- Colors odds rows in one color and even rows with a different color.Highlight on hover- set the highlight behavior when the hovers over a row
There are three options for hover-
- Row- the entire row of the cell is highlighted.
- Column- the entire column of the cell is highlighted.
- Row and column- the row and column intersecting in the cell are highlighted.
The image below shows a table for selecting the row and column options.
Show rank column- adds a column on the left side of the table with the row number.
* The rank column isn't included in an export of the table.
back to the top ↑
Header settings
Set the table header display.
Background- set the header background color.
Text- set the header text color, font type, and style.
Border- set the header border display.
Hide header- hide the header row from the display.
Header as chip- display the header cells text as chips; this display makes it easier for a user to change the column's order dynamically.
Column settings
Set the styling of individual columns or all the columns.
The column styling setting overrides any general column style settings.
The dropdown control allows the selection of an individual column or all columns.
Background- set the background in the column.
Text- set the font color in the column.
Font style- set the font style in the column.
Align- set the horizontal text alignment in the column.
Position- set the vertical text alignment in the column.
Min column width- set the minimal width of the column.
Divider lines- set the display mode of the column divider lines.
Select one of the options:Auto- inherit from the general divider lines setting.
Show- show the divider lines always.
Hidden- hide the divider lines always.
Sort icon- set the sort icon display in the column header.
Select one of the options:Active- the icon appears if the column is currently used to sort the table.
Always- the icon appears all the time.
On hover- the icon only appears when hovering over the column's header.
Hidden- the icon is hidden all the time.
Filter icon- set the filter icon display in the column header.
Select one of the options:Active- the icon appears if the column is currently used to filter the table.
Always- the icon appears all the time.
On hover- the icon only appears when hovering over the column's header.
Hidden- the icon is hidden all the time.
The image below shows the table display with the settings in the above image applied to the sales country column.
Visual representation settings
Set the display of the different visual representation types.
Progress bar-
Background- set the background color of the bar.
Bar color- set the fill color of the bar.
Show range levels- show the min and max values below the bar.
Show value- show the bar value.
Position- set the bar value display position.
Bar radius- set the corner radius of the bar corners.
Line chart-
Color- set the line color.
Type- select the line type.
Width- set the line width.
Bar chart-
Coloring method-
Select the coloring method:Single- all bars are colored with the same color.
Categorical- each value on the axis is colored with a different color
Gradient- bars are colored according to their measure value.
Bars- set the color or color palette for the bars.
Negative bars- set a special color for bars with negative value.
Bar padding- set the padding between the individual bars.
Bar radius- set the corner radius for the bar top corners.
Y-axis start- set the value for y-axis start.
Border settings
Set the table border display.
Table border- enable\disable the table border display.
Color- set the border line color.
Line Type- set the border line type.
Width- set the border line width.
Table radius- set the table corners radius.
back to the top ↑
Divider lines settings
Set the table divider lines display.
Display type-
Select one of the options:Auto- displays only horizontal divider lines.
Show horizontal- display only horizontal divider lines.
Show vertical- display only vertical divider lines.
Show all- displays both horizontal and vertical divider lines.
Hidden- hides all divider lines.
Totals settings
Set the table's total row display.
Background- set the background color of the total row.
Text- set the font color of the total row.
Font style- set the font style of the total row.
Position- select the position for the total row.
back to the top ↑
Layout Tab Settings
Define the table layout and other layout settings.
Columns settings
Width method-
Set the width method for the table columns.Auto-width- the column content sets column width.
Different columns have different width.Fixes width- set a fixed width to all columns.
Min width- set the minimal width for all columns.
Content
Merge cells by value- merge dimension cells that have the same value.
This setting is only active if there is more than one dimension in the table.
(check the region column display)
Word wrap header row- display as many lines as needed to display the header text.
Word warp content- change the row height to as many lines as needed to display the cell's content.
Fixed row height- set the method to define the row height.
Fixed- all rows have the same height as defined in the input box.
Auto- rows height is set by content.
back to the top ↑