Bar chart visualization

Latest Dynatrace
How-to guide
2-min read

When to use a bar chart visualization

Use a bar chart:

When you want to show the frequency of a single or a few (2-3) different categories over time.
When you want to compare such categories and their contribution to the whole over time. A bar chart allows you to directly compare the values of different categories, which correspond to the length of the bar, similar to an area chart. This is particularly useful when you have discrete categorical data and you want to highlight differences.
When you want to show ranking or order of data.

Example

Bar chart example

The chart above is based on the following query.

timeseries avg(dt.host.cpu.usage)

The visualization type is set to Bar chart.
Other options are set to defaults.

Chart interactions

To access the chart tools:

When space is limited, hover over the chart and select Chart tools to open a menu of chart tools.
When there is sufficient space, the chart tools are displayed in a toolbar.

Timeseries chart toolbar - full

When you hover over the chart, the chart toolbar is displayed by default in the lower-right corner of the chart and is collapsed.

Name	Keyboard shortcut	Action
Move	none	Move the chart toolbar. Select and drag the icon.
Explore	`E`	Explore a section of the chart. Select Explore, and then click and drag left or right to select a section of the chart. The chart zooms to display the selected area.
Pan	`P`	Pan the chart to the left or right. Select Pan, and then click and drag left or right.
Zoom in	`Ctrl+Up`	Zoom in to the chart.
Zoom out	`Ctrl+Down`	Zoom out from the chart.
Reset	`R`	Restore the chart zoom level and timeframe to their original states.
Collapse	none	Shrink the chart toolbar to just and .
Expand	none	Show the entire chart toolbar.

Zoom rules

For a timeseries chart (Line, Area, Bar):

You can't zoom on the chart if the timeframe is set in the DQL query.
Dashboards

If you zoom on a tile without a custom tile timeframe, the global timeframe for the dashboard is updated accordingly, so timeframes stay in sync across the dashboard except where a tile has its own overriding timeframe.

If you zoom on a tile with a custom tile timeframe but without a timeframe in the query, the selected timeframe is applied to the custom tile timeframe and the changed timeframe is reflected in the dashboard.
Notebooks

If you zoom in a timeseries in a notebook section, the timeframe of the section changes, and the change is persisted in the notebook.

Selection interactions

When you select a value on a chart and pin the displayed tooltip open, you can then hover over the tooltip to display a menu of selection-specific options.

The chart interactions available to you depend on your query and visualization. For example, if you select a host on a line chart and hover over the tooltip, you will see a menu of items such as:

Copy name—copy the name of the selected host.
Fields—a section with a submenu for each query field. A field submenu offers field-specific options such as:
- Copy value—copy the value of the field. Also displays the field type.
- Hide—hide the field in the chart.
- Explain value—use AI to explain the field.
- Add command to query—a section of field-specific commands that you can automatically add to your query.
- A recommended app may also be listed.
Visual options—opens the edit panel so you can change visualization options for the selected item.
Set color—opens the edit panel so you can change the color of the selected item.
Go to host—opens the selection in Infrastructure & Operations.

In general, if there are recommended apps to open the selected item, the menu offers direct links to those apps, followed by an Open with option to select a different target app.
Open with—for details, see Drilldowns and navigation.

Title

Use the title field at the top of the options panel (initially Untitled tile or Untitled section) to add a title to your dashboard tile or notebook section.

You can use emojis such as 😃 and 🌍 and ❤️.
You can use variables.

Example:

Define variables called Status and Emoji in your dashboard.
Set the title to Current $Emoji status is $Status.
Set Status to Good.
Set Emoji to 🌍.

The title will be displayed as Current 🌍 status is Good.

Visualization

If you aren't sure that you chose the right visualization, use the visualization selector to try different visualizations.

Data mapping

The data mapping section shows how a column of your result is mapped to the visualization.

For example, when working with DQL and a timeseries, in the result we have a column with a value array for each series (one row with that one cell of values). For a timeseries, this mapping is done fully automatically, but the data mapping shows you which underlying column is mapped.

Expand for general rules on data mapping settings

Expand the Data mapping section of your visualization settings to see how data in your result is mapped to your visualization, and to adjust those settings if needed.

Mandatory fields are marked with an asterisk (*). Example:

Example data mapping: line chart
Data types are displayed next to field names in dropdowns and mapped fields.
Units are displayed when there’s only one assigned.
Result fields are grouped into Suitable and Unsuitable. Fields are marked as unsuitable if they cannot be used to display data in the visualization. Example:

Example data mapping: line chart, Time dropdown
Automatic application of data mapping default settings:

Dynatrace version 1.319+
- Already existing tiles and sections are considered to be user-defined. Their data mapping configurations aren't updated automatically.
- Newly created tiles and sections apply a data mapping setting by default. If you don't modify these settings manually, these settings might change if a new execution of the tile/section modifies the results and there are fields missing or new fields that better suit the data mapping.

Data mapping restrictions for event-based graph visualizations

Dynatrace version 1.322+

What changed?

To make data mapping easier and more intuitive, we’ve restricted certain fields in the interface for event-based charts, showing only the most relevant options.

Before: Prior to Dynatrace version 1.322, fields such as timestamp, interval, and duration could be mapped to the "names" option within the data mapping surface.
After: Starting with Dynatrace version 1.322, these fields are no longer available for selection in the "names" option.

Impact

If your Dashboards Dashboards or Notebooks Notebooks charts rely on these fields, the affected tiles will display an error message, such as:

Selected field unavailable. The field "" is no longer available. Try adjusting the data, or select another field or visualization.

Resolution

To resolve this issue

Replace the existing summarize command with makeTimeseries.
Replace the by: { ... 4h } parameter with interval: 4h while using the same interval as with the previous configuration in the by.

After applying these changes, the data mapping will correctly allow suitable fields for the "names" option, and your tiles will function as expected.

Visualization-specific data mapping settings

A bar chart graphs one or more values over time, so the mapping needs to include the following:

Time: the column of your result that is used for the X-axis (timestamp or timeframe).
Interval: this value is automatically mapped and can’t be changed. It lets you know which fields are mapped for timeseries-based results. It takes the first available interval field from the result set whenever a timeseries is used (also includes any makeTimeseries-based data).
Values: a selection of one or more values that your chart graphs over time.
Names: the elements displayed, for example, in the legend and series names.

Time axis

Selects the X-axis.

Left axis

Sets the scale of the left axis:

Logarithmic
Linear

Show legend: To display a legend, turn on Show legend and select the legend Position.
Position: Determines where to display the legend.
- Auto: Selects an appropriate location based on the visualization size and the available space.
- Bottom: Displays a legend under the visualization.
- Right: Displays a legend to the right of the visualization.
Text truncation: Determines how to truncate text when the full text can't be displayed.
- A…: Trim from the right end of the text (when the right end is less important)
- A…B: Trim from the middle of the text (when the middle is less important)
- …B: Trim from the left end of the text (when the left end is less important)
Tooltip variant
- Grouped displays points from the closest data
- Shared shows all points for this timestamp
Tooltip series mode: Defines if the tooltip shows a datapoint's properties in one or multiple lines.
- Single line
- Multi line

Colors

The color settings for a visualization are displayed in rows.

Each row associates a color scheme with a condition/value related to a selected field displayed in the visualization.

To adjust the settings for a row, there are two menus of settings that will be used in combination to determine which color is displayed:

The first menu in a row displays the selected color or color palette. Open this menu to display three tabs of color options:
- Palettes: select a color palette to use for this row.
  Palette exceptions for certain visualization types
  Heatmap and honeycomb: the palette only applies the first color (unless color rules match the data mapping values or Name is used), and the palette is not reflected in the legend.
  Categorical: the nth color in the palette is applied to the nth item in the series.
  Categorical for multiple subcategories: palettes are by bin but are not reflected in the legend.
  Table: palettes are not applicable to tables.
- Colors: select a color to apply uniformly when this rule matches.
- Custom: specify a precise hex color code (for example, #134FC9) or use the color picker to select a color visually.
The second menu in a row displays the condition under which this row's color will be displayed. Select the current setting to change the field, operator, and value as needed to evaluate the condition.
- The fields available for evaluation depend on the raw data.
  - Name is a special property constructed via the Data mapping setting Names.
  - Value is a special property constructed via the Data mapping setting Values (heatmap visualization only).
- The available operators change to suit the conditon being evaluated.

Colors: additional actions

To add a row, select and configure it as described above.
To move a row up or down in the table, select and drag .
opens a menu of further options:
- Move up and Move down move the row up or down one row. These are alternatives to .
  
  Remember that colors are applied in the order in which they are listed in the Colors section, from top to bottom, so changing the order may give you different results.
- Duplicate creates a copy of the selected row.
- Delete section removes the row. You can delete all color rules for table and single value visualizations; all other visualizations need at least one color rule.

Colors: Examples:

Pie

In this pie visualization example, we have applied:

Green to slices with values below 15.
Yellow to slices with values at or above 15.
Red to slices with values at or above 20.

If you changed the order of the rows in the Colors section, you would see different colors. For example, if you swapped rows 2 and 3 above, all slices with values at or above 20 would be colored red, but then all slices with values at or above 15, including all the red slices, would be colored yellow.

Example pie visualization with coloring applied

Honeycomb

In this honeycomb visualization example, we have applied:

Green to all value.A values.
Yellow as a row marker (on the left) for value.A values at or above 15.
Red to the entire row for value.A values at or above 20,

The result is a fully thresholded honeycomb chart. You can use other honeycomb visualization settings to adjust the labels, tooltip, legend, and so on.

Example honeycomb visualization with coloring applied

Thresholds

Each row in the thresholds settings associates a color with a value or range of values in the visualization. For example, you can specify that everything between two values is shaded green in the chart. Note: the line, area, column, scatterplot, and heatmap visualizations only allow thresholds for numeric fields.

To configure a threshold in a dashboard or notebook visualization

Select to edit the visualization tile.
Expand the Thresholds section.
Not all visualization types have thresholds settings
Only the following visualizations have Thresholds settings:
- Area
- Categorical
- Line
- Bar
- Band
- Histogram
- Scatterplot
For other visualization types, use the Colors section to get similar effects by applying value-dependent colors to visualization elements such as table rows, honeycomb cells, and pie slices.
To add a row, select .
Define the threshold.

For each row, there are two menus of settings that are used in combination to determine which color is displayed if the threshold conditions are met:
- Open the first menu to select a standard or custom color to display for the selected threshold.
  - Use the Colors tab to select from standard colors. Values are dynamic and vary based on the selected theme (light or dark).
  - Use the Custom tab if you would rather specify a precise hex color code (for example, #134FC9) or use the color picker to select a color visually.
- Open the second menu to define the threshold conditions for this color. This can be a range or a single value:
  - Use the Range tab if you want to define a threshold range (two values) between which the selected color should be applied.
    
    Filled: When this is turned off, the range is indicated only on the Y-axis by a range indicator in the selected color. When this is turned on, everything within the range is also colored.
    Min: the minimum value of the range.
    Max: the maximum value of the range.
    Label: the label to display (with the range) when you hover over the Y-axis range indicator.
  - Use the Line tab if you want to define a single threshold Value and Label. This draws a line of the selected color at the value you set here.

Thresholds: Additional actions

To add a row, select and configure it as described above.
To move a row up or down in the table, select and drag . The order of these rows matters: if two settings match, the last match is the one applied to the chart.
opens a menu of further options:
- Move up and Move down move the row up or down one row.
  These are alternatives to .
- Duplicate creates a copy of the selected row.
- Delete section removes the row.

Thresholds: Examples

Line

In this table visualization example, we have applied:

Green from 0% to 75%.
Yellow from 75% to 90%.
Red from 90% to 100%.

Example line visualization with thresholds applied

Units and formats

To override the default units and formats in a dashboard or notebook visualization

Select to edit the visualization tile.
Select the Visual tab.
Expand Units and formats.

The Units and formats section lists all available unit settings for the document (dashboard or notebook). Some units may already be added automatically when querying metrics from their metadata.

Each row has two menus:
- The left menu displays unit settings.
- The right menu displays field mapped to that unit.
Example rows in "Units and formats" settings
To edit unit settings, open the left menu and review/set the following settings:
- Unit: The base unit in which the values were captured. It's None if it was not included in the DQL result, or its automatically defined by the unit passed from the DQL result. This field doesn't lead to any conversion but modifies the suffix to correspond to the unit.
- Convert: You can turn on Convert for conversion. For example, if the DQL result defined your numeric value in the result as Bytes, Convert now offers a suitable list of byte conversions such as Kilobyte and Megabyte.
  
  Only linear and static conversions are supported. For example, you cannot convert Degree Celsius(°C) into Degree Fahrenheit(°F), or convert Usd(US$) into Eur(€).
The Format section determines how the unit is displayed:
- Decimals: displays the default number of decimals (degree of precision) to display. To see it in action, change the Decimals selection and observe the change in the visualization.
- Custom suffix: displays the suffix to display after the unit. To see it in action, turn on Custom suffix, enter a string, and observe the change in the visualization. When you don't find the unit you're looking for, you can use Custom suffix to display the desired unit.
- Abbreviate large numbers: displays large figures in abbreviated form,. For example, 1053 becomes 1.1K.
- Multiple units: displays more than one unit. Turn this on and select the number of units to display. For example, 90 seconds becomes 1m 30s if multiple units is enabled and 2 units are selected.
To choose a different field for a row, open the right menu in that row and select a field from the available fields.

Units and formats: Additional actions

To add a row, select (Add) and configure it as described above.
(Actions) opens a menu of further options:
- Duplicate creates a copy of the selected row.
- Delete removes the row.
- Reset resets the settings in the selected row to default/metadata values.

Units and formats: Examples

Chart average CPU across all hosts

This example uses a line chart, but the options apply to other visualizations.

In Dashboards, create a dashboard.
Select and, in the Library section of the menu, select Chart average CPU across all hosts.
In the edit panel, select the Visual tab and select Line.
Expand Units and formats.

One row is already defined based on metadata from avg(dt.host.cpu.usage).
To override the unit settings for that field, open the left menu in that row to display the unit settings.
Define an override for the displayed metric. You can observe your changes in the Y-axis of the chart.
- Unit displays Percent, which is the default unit for the selected metric.
- Turn on Convert to try conversions settings. For example, change Auto to One to display the result as a fraction of 1.
- Decimals displays the default number of decimal points (degree of precision) to display. For example, enter Pct and review the dashboard to see Pct instead of % displayed after the percentage value.
- Turn on Custom suffix to try different suffixes to display after the unit. For example, change the Decimals selection and review the dashboard to see the change in the number of decimal points in the percentage value.

To reset to defaults (discard override settings for the selected metric), open the (Actions) menu for that row and select Reset.

Query limits

Use the Query limits section to check and adjust the Grail query limits per notebook section or dashboard tile. These settings determine the maximum limits when fetching data. Exceeding any limit will generate a warning.

Dashboard tiles and notebook sections created in Dynatrace earlier than version 1.296 are not affected. Those existing tiles/sections will return the same results as before.

Read data limit (GB)

The limit in gigabytes for the amount of data that will be scanned during a read.
Record limit

The maximum number of result records that this query will return. Default: 1,000 records. To see more records, you need to increase the value of Record limit.
If your query has no limit, such as

fetch logs

the value of Record limit is applied. By default, you will see up to 1,000 records.

If your query also includes a limit, such as

fetch logs
| limit 2000

the lower of the two values (either limit in your query, or Record limit in the web UI) is applied.

In the example above, you would still see only 1,000 records unless you increased the value of Record limit.
Result size limit

The maximum number of result bytes that this query will return. For better performance with typical queries and smaller documents, the default is set to 1 MB.
Sampling (Logs and Spans only)

Results in the selection of a subset of Log or Span records.