After using SQL to gather, structure and analyze all of the necessary data for your analysis, you can build visualizations on top of that data. Mode offers a number of options for building visualizations, including the ability to take your analysis even further using Python / R or using any type of custom visualization using JavaScript (e.g., D3).

Quick Charts

Mode reports offer a number of built-in charts and tables that can be quickly built on top of query results.

To manage built-in charts and tables in the report editor, locate and hover over the visualization's name on the left side of the report editor and click the More button to:

  • Duplicate: Creates a copy of the visualization and adds it to the report layout.
  • Add to builder: Adds the visualization to your report's layout if it is not already there.
  • Remove from builder: Removes the visualization from the report layout but does not delete it from the editor.
  • Delete: Removes the visualization from your report layout and deletes it from the editor.


Tables display data in a format that is both customizable and easily digestable for end users. You can create new tables in a couple of different ways. One option is to click on the green “Add Chart” dropdown above the query editor and select the Table chart.

add chart

Another option is to find the query with the data you want to display and click the + button under it and select the Table chart

create table

Once you arrive at the chart editor page, a solid first step is to begin constructing your table. You can do this by adding desired columns from the “Dimensions” and “Measures” fields over to the “Columns” section under the “Chart Settings” interface. This can be done by either dragging and dropping or by using the type ahead search option. Further, you can add columns that you wish to be used as filters under the “Filters” section.

Once you construct your table, there are many formatting options that you can apply to individual columns. You can access these formatting options by clicking on the “Format” dropdown located on the top header of the Chart Editor page.

format tables

One potential option is to display numeric data as currency or percent, and to increase/decrease decimal places. Another option is to display date entries as Mon Year, Year-Mon-Date, and Date and Time. A third option is to create URL links from string entries.

In addition to formatting the columns, you can also adjust the column width by clicking on the “Size" to fit" dropdown located on the top header of the Chart Editor page and selecting "Manually size"

Moreover, there are many formatting options that can be applied to table as a whole. You can access these options by clicking on the “Format” section directly to the right of the “Field” section. It is worth noting that any sorting/formatting options you select will persist beyond your current session and will determine how the Table appears on the Report page.

add table columns

One potential option is to display the table with alternating row colors. These alternating row colors tend to make Tables more presentable to end users. Another option is the ability to alter row heights to standard, compact, and open. By altering row heights on larger data sets, users can make more rows appear at once and reduce the amount of scrolling needed to navigate the data set. A third option is to show column/row gridlines, and to show row numbers


Mode includes a number of built-in charts that you can quickly build on top of query results and add to your reports. To add a new chart:

  1. On the left side of the report editor, find the query with the data you want to visualize and click the New button under it.
  2. Click Add Chart.
  3. Under Chart Settings, select the desired chart type from the dropdown menu and then follow the instructions in the middle of the window.

Each column in your query's data is categorized as either a measure or a dimension based on the data it contains.

Dimension: Data that is typically qualitative and gives context to one or more measures (e.g., sales territory, customer ID, customer segment, etc.). Dimensions typically hold discrete data, such as categories or hierarchies, that cannot be aggregated.

Measure: Data that is quantitative and must be contextualized by one or more dimensions in order to be effectively understood (e.g., revenue, number of customers, etc.). Measures are typically aggregated (e.g., using sum, average, count, etc.) and grouped by dimensions.

Once you add a measure to your chart as a dependent variable (i.e., on the y-axis), you can click on its pill to adjust the type of aggregation that is performed.

Big Values

Big value visualizations are useful for highlighting key metrics and how those metrics change over time. You can create new Big Values in many different ways. One option is to click on the green “Add Chart” dropdown in the query editor page. Once you land on the chart editor page, the default chart selection is Table. From there you can begin constructing a Big Value by navigating over to the Settings section and selecting the “Big Value” chart.

Another option is to find the query with the data you want to display and click the green + button under it. From there, you select the “Add chart” option, and as with the first method once you land on the chart editor page the default chart selection is Table, and you can switch over to Big Value by navigating to the Settings section and selecting the “Big Value” chart.


Once you navigate to the Big Value chart, you can use the following options to configure your Big Value. You can add any field from either Dimensions or Measures into each of these dropzones:


  • Value: The field with the data you want to display. Click on the little arrow to the right of the column name to choose the aggregate type.

  • Trend By: The field that you would like to group the dataset by to determine the aggregate values. After you’ve dropped a field in here, the Value we display is the last one in your grouped dataset. Note that the the default sort order is ascending by the field you have in the *Trend by. *If you would like to alter the sorting, you can do so by clicking on the sort ascending and sort descending buttons in the toolbar above.

  • Indicator: Chooses how the inputted value compares to another value. Click on the little arrow to the right of the field name to choose the aggregate type, calculation format, and the value for comparing to the Big Value. Note: If you want to mirror the functionality of the Mode’s old Big Numbers, add the same field that you have in the Value dropzone to the Indicator dropzone.

  • Format: use format shortcuts at located in the top toolbar to the right panel’s to customize the formats of Value and Indicator. These options include plain text, currency, number, and percentage.

Big value

Display Table

** Note that we now no longer actively support Display Tables and we are in the process of sunsetting them at some point in the future **

The first time you successfully execute a query, a display table containing the query's results is automatically added to your report. By default, data tables display all columns returned in the underlying query and each column is formatted according to the data type of each column.

Click on Display Table under any query in your report to control how that query's display table is formatted and sorted, and to show or hide columns:

  • Columns: Un-check any columns on the right side to remove them from the table.
  • Sort: Click the header of the column you'd like to sort the table by and click the drop down button to choose how you want the table sorted.
  • Formatting: Click on the column header for any column to see formatting options for that column on the right side of the window. Depending on which format you choose, a number of additional customization options will appear.

Pivot Table

A pivot table aggregates and summarizes (e.g., using sum, average, count, etc.) query results and presents them in a data table. To add a pivot table to a report:

  1. On the left side of the report editor, find the query with the data you want to display and click the New button under it.
  2. Click Add Pivot Table to add a new pivot table to the report's layout.
  3. Add one or more fields to the quadrants on the bottom right to configure. This can be done by dragging and dropping fields or by using the type ahead search option. Fields should be added to the rows quadrant in the order of nesting.

Creating a Pivot Table

To create a pivot table, start by opening the New Chart menu. You can launch the New Chart menu in two places:

  1. In the left sidebar of the report editor, find the query with the data you want to work with and click the indented button under the query.
  2. While working on a query in the SQL editor, you can access the New Chart menu above the SQL editor.

creating a pivot table

Once you have opened the New Chart menu, select Pivot Table.

creating a pivot table

To create a pivot table, you will need to take the following actions:

  • Drop 1 or more fields to columns
  • Drop 1 or more fields to rows
  • Drop 1 or more fields to values

build a pivot table

Format Axes, Columns, Rows

Swap axes swaps the fields in the columns and rows in addition to swapping the axis where the measure names are displayed.

Show as column / row changes which axis the measure names are displayed on without altering the fields placed in rows and columns.

Once you have the data you care about, you can use these options to quickly fine tune how it is visually represented.

swap axes and row columns in a pivot table

Formatting Fields

You can individually format fields in pivot tables.

Formatting Fields in a pivot table

Conditional Color Formatting

Conditional color formatting is added to all Measure Values in the pivot table by default. There are multiple ways to conditionally color format the pivot table:

  • Apply color to a single field by adding fields to the color marks channel
  • Apply color to multiple Measure Values by adding Measures to the Measure Values shelf and select "Add all" in the color marks channel. The color can be removed by using the "Clear" option.
  • Color can be changed by selecting the "Edit Colors" icon in the color marks channel. The color can be added to the text instead of background by using the same affordance.

Pivot Table Conditional Color Formatting

Quick Calculations

Quick calculations are available in Pivot Tables.

Adding Filters

You can add filters to pivot tables by adding fields, including calculated fields, into the filters drop zone by dragging and dropping or by using the type ahead search. You can use calculated fields in all pivot table drop zones.

Adding filters

Grand Totals

You can toggle on and off either or both Column Grand Totals and Row Grand Totals using the Toolbar.

By default, Grand Totals will take on the same aggregation method as the values you are totaling over—for example, it will sum all the values if your measure is SUM(field) or it will average across all the values if your measure is AVG(field).

Grand Totals

Quick Sort

In the Toolbar, you have the ability to leverage our Quick Sort feature to sort your innermost discrete, categorical data by the outermost measure in either descending or ascending order.

Quick Sort

Advanced Sorting

However, you also have the option to define a more granular sorting behavior. When you can click on a field in your pivot table to open its context menu, you will see the ability to open the full visual explorer sort dialogue.

From there, you can specify exactly how you’d like to sort using your selected field. We currently support four sorting methods:

  1. By data value

  2. By field

  3. By manual

  4. By nested

Advanced sorting

For a full breakdown of each of these options, visit our visual explorer sorting documentation.

Notebook Visualizations

Every report contains a built-in Notebook environment where you can take the results of one or more queries, further analyze them in Python or R, and visualize the results using one of the many built-in libraries.

The contents of any Notebook output cell can be added to your report. These visualizations will update whenever the Notebook is run and the output changes.

Custom Visualizations

Mode supports the ability to customize Mode's native visualizations or add custom D3 visualizations to a Mode report. When editing a Report, in the Report Builder's top toolbar, click the icon </> to customize the Report's HTML. The HTML editor lets you use valid HTML, JavaScript, or CSS in the layout of your report, allowing you to add interactivity, custom visualizations, and more. To help you get started, Mode's community maintains the Alamode JavaScript library that makes creating D3-powered visualizations a snap.

Check out Mode's Gallery for inspiration, sample reports, and more information about how to create advanced visualizations in Mode.


Q: Is there a limit to how many visualizations can be added to a report?

Our recommendation is to limit the number of visualizations in a single report to 20. This is due to the fact that excessive visualizations can increase the loading time of the report. As the number of visualizations increases, more aggregation needs to be performed on the server, which can lead to slower loading times. By limiting the number of visualizations, you can ensure that your report loads quickly and efficiently.

Q: Can you visualize a notebook generated visualization with Mode’s native chart editor?

At this time, it is not possible to use our visualization tools, such as Quick Charts and Visual Explorer, to manipulate Python/R dataframes. To visualize data from a notebook, you will need to use a visualization library to create a visualization. If you would like to see this functionality added in the future, please contact our Support team and they will be happy to add a request on your behalf for future consideration.

Was this article helpful?

Get our weekly data newsletter

Work-related distractions for every data enthusiast.