Skip to main content

Dashboard visualizations types

This article outlines the types of visualizations available to use in AI/BI dashboards and shows you how to create an example of each visualization type. For instructions on building a dashboard, see Create a dashboard. You can use natural language to prompt the assistant to create bar, line, point map, scatter, pie, and counter charts. See Create visualizations with Databricks Assistant.

note

To optimize performance, charts can only render 10K rows or 10MB on the canvas, whichever is smaller. Otherwise, visualizations can be truncated.

Area visualization​

Area visualizations combine the line and bar visualizations to show how one or more groups' numeric values change over the progression of a second variable, typically that of time. They are often used to show sales funnel changes through time.

To adjust the layout:

  • Click the Kebab menu kebab menu in the Y Axis section of the visualization editing panel.
  • In the Layout section, choose Stack or 100% Stack.

Area visualization example

Configuration values: For the provided area visualization example, the following values were set:

  • Dataset: TPCH orders
  • Visualization: Area
  • Title: Total price and order year by order priority and clerk
  • X-axis:
    • Field: o_orderdate
    • Scale Type: Temporal
    • Transform: Yearly
    • Axis title: Order year
  • Y-axis:
    • Field: o_totalprice
    • Axis title: Total price
    • Scale Type: Quantitative
    • Transform: Sum
  • Group by:
    • Field: o_orderpriority
    • Legend title: Order priority
  • Filter
    • Field: TPCH orders.o_clerk

SQL query: For this area visualization, the following SQL query was used to generate the data set named TPCH orders.

SQL
SELECT * FROM samples.tpch.orders

Bar chart​

Bar charts represent the change in metrics over time or across categories and show proportionality, similar to a pie visualization.

Bar visualization example

To adjust the layout:

  • Click the Kebab menu kebab menu in the Y Axis section of the visualization editing panel.
  • In the Layout section, choose Stack or 100% Stack, or Group.

Configuration values: For the provided bar chart example, the following values were set:

  • Dataset: TPCH orders
  • Visualization: Bar
  • Title: Total price and order month by order priority and clerk
  • X-axis:
    • Field: o_orderdate
    • Transform: Monthly
    • Scale Type: Temporal
    • Axis title: Order month
  • Y-axis:
    • Field: o_totalprice
    • Scale Type: Quantitative
    • Transform: Sum
    • Axis title: Total price
  • Group by:
    • Field: o_orderpriority
    • Legend title: Order priority
  • Filter
    • Field: TPCH orders.o_clerk

SQL query: The following SQL query generated the data set TPCH orders for this bar visualization.

SQL
SELECT * FROM samples.tpch.orders

Box chart​

The box chart visualization shows the distribution summary of numerical data, optionally grouped by category. Using a box chart visualization, you can quickly compare the value ranges across categories and visualize the locality, spread, and skewness groups of the values through their quartiles. In each box, the darker line shows the interquartile range. For more information about interpreting box plot visualizations, see the Box chart article on Wikipedia.

Box chart example

For the provided box chart example, the following values were set:

  • X column (dataset column): l-returnflag
  • Y columns (dataset column): l_extendedprice
  • X axis title: Return flag1
  • Y axis title: Extended price

SQL query: For this box chart visualization, the following SQL query was used to generate the data set.

SQL
select * from samples.tpch.lineitem

Bubble chart​

Bubble charts are scatter charts where the size of each point marker reflects a relevant metric. To make a bubble chart, select Scatter as your visualization type. In the Size setting, select the metric you want represented by the size of the markers.

Bubble chart visualization example

Configuration values: For the provided bubble chart example, the following values were set:

  • Dataset: NYC taxi trips
  • Visualization: Scatter
  • Title: Trip distance, fares, and trip duration
  • X-axis:
    • Field: trip_distance
    • Scale type: Quantitative
    • Transform: None
  • Y-axis:
    • Field: fare_amount
    • Scale type: Quantitative
    • Transform: None
  • Color by:
    • Field: pickup_zip
  • Size:
    • Field: time_spent
    • Transform: None

Choropleth map​

In choropleth visualizations, geographic localities, such as countries or states, are colored according to the aggregate values of each key column. The query must return geographic locations by name. Users can create maps that display administrative boundaries at the country, state or province, and county or district level.

Choropleth map example

Configuration values: For this choropleth visualization, the following values were set:

  • Dataset: tcph nation
  • Country: Country
  • Color: sum(c_acct_bal)

SQL query: For this choropleth visualization, the following SQL query was used to generate the data set.

SQL
SELECT
initcap(n_name) as Country,
sum(c_acctbal)
FROM samples.tpch.customer
join samples.tpch.nation where n_nationkey = c_nationkey
GROUP BY 1

Combo chart​

Combo charts combine line and bar charts to present the changes over time with proportionality.

Combo chart example

Configuration values: For this combo chart visualization, the following values were set:

  • Dataset: partsupp
  • Visualization: Combo
  • X-axis: ps_partkey
    • Scale Type: Quantitative
  • Y-axis:
    • Bar: ps_availqty
    • Aggregation type: SUM
    • Line: ps_supplycost
    • Aggregation type: AVG
  • Color by Y-Series:
    • Sum of ps_availqty
    • Average ps_supplycost

SQL query: For this combo chart visualization, the following SQL query was used to generate the data set.

SQL
SELECT * FROM samples.tpch.partsupp

Dual-axis combo chart​

You can use combo charts to show two different y-axes. With your combo chart widget selected, click the Kebab menu kebab menu on the Y axis settings in the chart configuration panel. Turn on the Enable dual axis option.

Dual-axis combo chart example

Configuration values: For this combo chart, the Enable dual axis option is on. The other configurations are set as follows:

  • Dataset: Trips
  • Visualization: Combo
  • X-axis: tpep_pickup_datetime
    • Scale Type: Temporal
    • Transform: Weekly
  • Y-axis:
    • Left Y-axis (Bar): trip_distance
      • Transform: AVG
    • Right Y-axis (Line): fare_amount
      • Transform: AVG

Color by Y-series:

  • Average trip_distance
    • Average fare_amount

SQL query: The following SQL query was used to generate the data set:

SQL
SELECT * FROM samples.nyctaxi.trips

Counter visualization​

Counters display a single value prominently, with an option to compare them against a target value. To use counters, specify which data to display on the counter visualization for the Value and Target columns. If you apply aggregations in the visualization editor, you cannot compare values by selecting a Value row number, as in the following example. To compare specific row values, use a dataset that includes any required aggregations in the SQL that defines it. This allows you to select target and value rows for comparison.

Counter example

You can set conditional formatting and customize the text style in the Value configuration details.

Conditional formatting options for the displayed counter chart.

Configuration values: For this counter visualization example, the following values were set:

  • Dataset: Counter example
  • Visualization: Counter
  • Title: Orders: Total price by date (previous two days)
  • Value:
    • Field: total price
    • Value row number: 1
  • Target:
    • Field: total price
    • Value row number: 2

SQL query: For this counter visualization, the following SQL query was used to generate the dataset:

SQL
SELECT
  SUM(o_totalprice) as `total price`,
  o_orderdate
FROM
  samples.tpch.orders
GROUP BY o_orderdate
ORDER BY o_orderdate DESC

Line visualization​

Line visualizations present the change in one or more metrics over time.

Line visualization example

Configuration values: For this line visualization example, the following values were set:

  • Dataset: TPCH orders
  • Visualization: Line
  • Title: Average price and order year by order priority and clerk
  • X-axis:
    • Field: o_orderdate
    • Transform: Yearly
    • Scale Type: Temporal
    • Axis title: Order year
  • Y-axis:
    • Field: o_totalprice
    • Transform: Average
    • Scale Type: Quantitative
    • Axis title: Average price
  • Group by:
    • Field: o_orderpriority
    • Legend title: Order priority
  • Filter
    • Field: TPCH orders.o_clerk

SQL query: For this bar visualization visualization, the following SQL query was used to generate the data set named TPCH orders.

SQL
SELECT * FROM samples.tpch.orders

Heatmap chart​

Heatmap charts blend features of bar charts, stacking, and bubble charts allowing you to visualize numerical data using colors. A common color palette for a heatmap shows the highest values using warmer colors, like orange or red, and the lowest values using cooler colors, like blue or purple.

For example, the following heatmap visualizes the most frequently occurring distances of taxi rides on each day and groups the results by the day of the week, distance, and total fare.

note

Heatmaps can display up to 64K rows or 10MB.

Heatmap example

Configuration values: For this heatmap chart visualization, the following values were set:

  • Dataset: TPCH orders
  • Visualization: Heatmap
  • X column (dataset column): o_orderpriority
  • Y columns (dataset column): o_orderstatus
  • Color column:
    • Dataset column: o_totalprice
    • Aggregation type: Average
  • X-axis name (override default value): Order priority
  • Y-axis name(override default value): Order status
  • Color scheme (override default value): YIGnBu

SQL query: For this heatmap chart visualization, the following SQL query was used to generate the data set.

SQL
SELECT * FROM samples.tpch.orders

Histogram chart​

A histogram plots the frequency that a given value occurs in a dataset. A histogram helps you to understand whether a dataset has values that are clustered around a small number of ranges or are more spread out. A histogram is displayed as a bar chart in which you control the number of distinct bars (also called bins).

Histogram chart example

Configuration values: For this histogram chart visualization, the following values were set:

  • Dataset: TPCH orders
  • Visualization: Histogram
  • X column (dataset column): o_totalprice
  • Number of bins: 20
  • X-axis name (override default value): Total price

Configuration options: For histogram chart configuration options, see histogram chart configuration options.

SQL query: For this histogram chart visualization, the following SQL query was used to generate the data set.

SQL
select * from samples.tpch.orders

Pie visualization​

Pie visualizations show proportionality between metrics. They are not meant for conveying time series data.

Pie visualization example

Configuration values: For this pie visualization example, the following values were set:

  • Dataset: TPCH orders
  • Visualization: Pie visualization
  • Title: Total price by order priority and clerk
  • Angle:
    • Field: o_totalprice
    • Transform: Sum
    • Axis title: Total price
  • Group by:
    • Field: o_orderpriority
    • Legend title: Order priority
  • Filter
    • Field: TPCH orders.o_clerk

SQL query: For this pie visualization, the following SQL query was used to generate the data set named TPCH orders.

SQL
SELECT * FROM samples.tpch.orders

Pivot visualization​

A pivot visualization aggregates records from a query result into a tabular display. It's similar to PIVOT or GROUP BY statements in SQL. You configure the pivot visualization with drag-and-drop fields.

note

For performance reasons, pivot tables only support rendering 100 columns x 100 rows.

Pivot example

Configuration values: For this pivot visualization example, the following values were set:

  • Dataset: TPCH lineitem
  • Visualization: Pivot
  • Title: Line item quantity by return flag and ship mode by supplier
  • Rows:
    • Field: l_returnflag
  • Columns:
    • Field: l_shipmode
  • Cell
    • Dataset:
    • Field: l_quantity
    • Transform: Sum
  • Filter
    • Field: TPCH lineitem.l_supplierkey

SQL query: For this pivot visualization, the following SQL query was used to generate the data set named TPCH lineitem.

SQL
SELECT * FROM samples.tpch.lineitem

Point map​

Point maps display quantitative data as symbols placed at specific map locations. Markers are positioned using latitude and longitude coordinates, which must be included as part of the result set for this chart type. The following example uses data from motor vehicle collisions in New York, NY.

Point map example

Configuration values: For this point map visualization, the following values were set:

  • Dataset: motor vehicle collisions
  • Visualization: Symbol map
  • Coordinates:
    • Latitude: LATITUDE
    • Longitude: LONGITUDE
  • Color/Group by:
    • Field: CONTRIBUTING FACTOR
note

No Databricks datasets include latitude or longitude data, so a sample SQL query is not provided for this example.

Sankey diagram​

A sankey diagram visualizes the flow from one set of values to another.

Sankey example

Configuration values: For this sankey diagram, the following values were set:

  • Dataset: Sankey example
  • Visualization: Sankey
  • Stages
    • stage1
    • stage2
  • Value
    • SUM(value)

SQL query: For this Sankey visualization, the following SQL query was used to generate the data set.

SQL
SELECT pickup_zip as stage1, dropoff_zip as stage2, sum(fare_amount) as value
FROM samples.nyctaxi.trips
GROUP BY 1, 2
ORDER BY 3 DESC
LIMIT 10

Scatter visualization​

Scatter visualizations are commonly used to show the relationship between two numerical variables. You can encode the third dimension with color to show how the numerical variables differ across groups.

Scatter example

Configuration values: For this scatter visualization example, the following values were set:

  • Dataset: TPCH lineitem
  • Visualization: Scatter
  • Title: Total price and quantity by ship mode and supplier
  • X-axis:
    • Field: l_quantity
    • Axis title: Quantity
    • Scale type: Quantitative
    • Transform: None
  • Y-axis:
    • Field: l_extendedprice
    • Scale type: Quantitative
    • Transform: None
    • Axis title: Price
  • Group by:
    • Field: l_shipmode
    • Legend title: Ship mode
  • Filter
    • Field: TPCH lineitem.l_supplierkey

SQL query: For this scatter visualization, the following SQL query was used to generate the data set named TPCH lineitem.

SQL
SELECT * FROM samples.tpch.lineitem

Table visualization​

The table visualization shows data in a standard table but allows you to manually reorder, hide, and format the data.

note

Tables can display up to 64K rows or 10MB.

Table example

Configuration values: For this table visualization example, the following values were set:

  • Dataset: TPCH lineitem
  • Visualization: Table
  • Title: Line item summary by supplier
  • Columns:
    • Display row number: Enabled
    • Field: l_orderkey
    • Field: l_extendedprice
      • Display as: Number
      • Number format: $0.00
    • Field: l_discount
      • Display as: Number
      • Number format: %0.00
    • Field: l_tax
      • Display as: Number
      • Number format: %0.00
    • Field: l_shipdate
    • Field: l_shipmode
  • Filter
    • Field: TPCH lineitem.l_supplierkey

Configuration options: For table visualization configuration options, see Table options.

SQL query: For this table visualization, the following SQL query was used to generate the data set named TPCH lineitem.

SQL
SELECT * FROM samples.tpch.lineitem
Last updated on
Was this article helpful?