Creating combo charts
The combo chart is suitable for comparing two sets of measure values that are usually hard to compare because of the differences in scale. It is basically a bar chart combined with a line chart.
You can create a combo chart on the sheet you are editing. In a combo chart, you need at least one dimension and one measure.
Do the following:
- From the assets panel, drag an empty combo chart to the sheet.
- Click Add dimension and select a dimension or a field.
- Click Add measure and select a measure or create a measure from a field. Select to show the measure as a bar.
- Add another measure by selecting Add under Height of line. Enter an expression, or master measure item, or a field with an aggregation function applied. By default a line will appear as the measure.
-
When you are done adding measures, configure each measure to display as bars, lines, or markers. For more information, see Configuring the presentation of measures.
You can only have one dimension, but you can continue adding up to 15 measures. You can only have two measure axes though. This means, if you add three or more measures with a large difference in value range it can be hard to display all measures with a good distribution of values.
When you have created the combo chart, you might want to adjust its presentation. For information about styling see Styling the combo chart. For information about customizing other aspects of the chart's appearance, see Changing the appearance of a visualization.
Styling the combo chart
You have a number of styling options available under Appearance in the properties panel.
Click Styling under Appearance > Presentation to further customize the styling of the chart. The styling panel contains various sections under the General and Chart tabs.
You can reset your styles by clicking next to each section. Clicking
Reset all resets styles for all available tabs in the styling panel.
For general information about styling an individual visualization, see Applying custom styling to a visualization.
Customizing the text
You can set the text for the title, subtitle, and footnote under Appearance > General. To hide these elements, turn off Show titles.
The visibility of the labels shown on the chart depends on how you configure the measure values to be displayed, as well as other chart-specific settings and label display options. Configure a measure to be shown as Bars, Line, or Marker by expanding the measure under Data > Measures, and clicking More properties. Configure additional chart and label options under Appearance > Presentation.
You can style the text that appears in the chart.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Under Appearance > Presentation, click
Styling.
-
On the General tab, set the font, emphasis style, font size, and color for the following text elements:
-
Title
-
Subtitle
-
Footnote
-
-
On the Chart tab, expand the Bars section. This section appears if any of the measures are being displayed as bars.
-
Under Bar labels, style the labels for measure values configured as Bars. You can select the font, font size, and color.
When using the Stacked presentation option, this setting controls Segment labels (measure values for each dimension value) and Total labels (combines the measure values for each dimension value).
-
Expand the Lines section of the Chart tab. This section appears if any of the measures are being displayed as lines.
-
Under Point labels, style the labels for measure values configured as Line. You can select the font, font size, and color.
-
On the Chart tab, expand the Markers section. This section appears if any of the measures are being displayed as markers.
-
Under Marker labels, style the labels for measure values configured as Marker. You can select the font, font size, and color.
-
On the Chart tab, set the font, font size, and color for the following text elements:
-
Axis title: Style the titles on the axes.
-
Axis label: Style the labels on the axes.
-
Legend title: Style the title of the legend.
-
Legend labels: Style the labels of the individual legend items.
-
Customizing the background
You can customize the background of the chart. The background can be set by color and image.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Under Appearance > Presentation, click
Styling.
-
On the General tab of the styling panel, you can select a background color (single color or expression). You can also set the background to an image from your media library or from a URL.
Information noteTo add a background image from a URL, the URL's origin needs to be added to the allowlist in your tenant's Content Security Policy. The origin must be added with the following Directive: img-src. This is done by a tenant administrator.
For more information, see Creating a CSP entry.
When using a background color, use the slider to adjust the opacity of the background.
When using a background image, you can adjust image sizing and position.
Customizing the bar segment outline and bar width
If your combo chart contains measure data represented as bars, you can adjust the outline surrounding each bar segment in the chart, as well as the width of the bars.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Under Appearance > Presentation, click
Styling.
-
On the Chart tab, expand the Bars section.
-
Under Outline, set the thickness and color of the outlines.
-
Adjust the slider for Bar width to set the width of the bars.
Customizing the lines and data points
If your combo chart contains measure data represented as lines, you can customize the appearance of the lines and data points in the chart.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Under Appearance > Presentation, click
Styling.
- On the Chart tab, expand the Lines section.
-
Under Data point size, adjust the slider to change the size of the data points in the chart.
-
Under Line options, adjust the line thickness, line type (solid or dashed), and line curve (linear or monotone).
Customizing the border and shadow
You can customize the border and shadow of the chart.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Under Appearance > Presentation, click
Styling.
-
On the General tab of the styling panel, under Border, adjust the Outline size to increase or decrease the border lines around the chart.
-
Select a color for the border.
-
Adjust the Corner radius to control the roundness of the border.
-
Under Shadow in the General tab, select a shadow size and color. Select None to remove the shadow.
Configuring grid line spacing
You can change the placement of grid lines on the chart. Select whether to show grid lines based on the primary or secondary axis, and adjust the spacing. You can also turn off grid lines if desired.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Expand Appearance > Presentation.
-
Toggle Grid line spacing from Auto to Custom.
-
Use the drop down menu to select whether the grid lines are placed along the Primary axis or Secondary axis.
Depending on the scale used by each axis, you might not notice any difference between these settings.
-
Use the second drop down menu to select the spacing, or choose No lines to remove grid lines.
Configuring the presentation of measures
Optionally, you can change the presentation of measures between bars, lines, or markers. Additional options are also available.
Do the following:
-
In the properties panel, under Measures, select More Properties in a measure.
-
Choose the Presentation of the measure. You can:
- Change the presentation of measures between bars, lines, or markers. For markers you can choose between several different shapes.
-
Select drop-down options to switch between the Primary axis or the Secondary axis.
Tip noteThe primary axis is on the left side of the chart, and the secondary axis in on the right side. Right and left axes are reversed if Right-to-left is turned on in app settings (see Styling an app).
Adding bar and marker labels
If any measures in the chart are configured as bars or markers, you can show or hide their value labels. Bar and marker labels can be configured separately from one another.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Under Presentation, do one or both of the following:
-
Set Bar labels to Auto.
-
Set Marker labels to Auto.
-
Adding segment and total labels
For combo charts with a specific configuration, you can add segment and total labels. Segment labels show values for each measure segment in a chart. Total labels show values for an entire set of measures arranged along a single axis.
You can add segment and total labels if all of the following apply:
-
Two or more measures on the same axis are configured as bars.
-
The combo chart uses the Stacked presentation option. This setting is located under Appearance > Presentation.
Tip noteThe Stacked presentation option becomes available when two or more measures have the following settings under Data > More properties:
-
The measures are configured as Bars.
-
The measures appear on the same axis.
For more information, see Configuring the presentation of measures.
-
-
Bar labels are set to Auto.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Under Presentation, set Bar Labels to Auto.
-
Do one or both of the following:
-
Set Segment labels to Auto.
-
Set Total labels to Auto.
-
Working with shapes
With shapes, you can add points and lines as separate items in the chart. Shapes allow you to enhance your dimension and measure data with special information that helps with analysis. For example, you could add a point to highlight a specific dimension value, or draw a line between the highest and lowest points for a key performance indicator.
Adding a point
Do the following:
-
In the properties panel, expand Add-ons > Shapes.
-
Click Add shape, and select Point.
-
Optionally, define a Label for the point using text or an expression.
-
Under Dimension value, type the dimension value for which to add the point. You can also define the value with an expression.
-
In the Measure input drop down menu, select one of the following and define the value below the menu:
-
Measure value: Define the measure value for which to add the point, either as a simple value or an expression. For example, you could use a set analysis expression.
-
Measure index: Define the measure from which the measure value is extracted. This can be provided as a simple value or an expression. For example, use 0 for the first measure in the chart, 1 for the second measure in the chart, and so on.
-
-
Set the Symbol to use for the point. The default is Circle.
-
Adjust the Label position if needed. The label can be displayed above or below the point.
-
Set color and opacity using the following settings. You can also configure these elements to have no color.
-
Point color
-
Outline color
-
Label color
-
-
Use the Colored background check box to add a background for the label, if defined. When this option is turned on, the defined Label color is used for the background, and the label text switches to a color that best contrasts the background.
-
Use the sliders to adjust the Outline width and Data point size.
Adding a line
You can add a line as a series of points. The line connects each point that you define for it.
Do the following:
-
In the properties panel, expand Add-ons > Shapes.
-
Click Add shape, and select Line.
-
Optionally, define a Label for the line using text or an expression. This does not appear in the chart but helps with identification when you have multiple lines and points.
-
By default, data points are not highlighted on the line. To highlight them, turn on Show data points at the bottom of the settings for the line. With this option turned on, more point settings are shown.
-
To add a point, click Add point.
-
Under Dimension value, type the dimension value for which to add the point. You can also define the value with an expression.
-
In the Measure input drop down menu, select one of the following and define the value below the menu:
-
Measure value: Define the measure value for which to add the point, either as a simple value or an expression. For example, you could use a set analysis expression.
-
Measure index: Define the measure from which the measure value is extracted. This can be provided as a simple value or an expression. For example, use 0 for the first measure in the chart, 1 for the second measure in the chart, and so on.
-
-
Adjust the point's appearance using the following settings. These settings become visible when Show data points is turned on.
-
Label: Set a textual label for the point.
-
Symbol: Set the shape of the point. The default is Circle.
-
Label position: Choose whether to show the label above or below the point.
-
Point color: Set the color of the point.
-
Outline color: Set the color of the point outline.
-
Label color: Set the color of the label text. If Colored background is turned on, this setting instead controls the background behind the label.
-
Outline width: Set the width of the point outline.
-
Data point size: Set the overall size of the point.
-
Colored background: Add a background for the label, if label text has been defined. When this option is turned on, the defined Label color is used for the background, and the label text switches to a color that best contrasts the background.
-
-
Add one or more points as needed, using the above steps.
-
Set the Line color, including opacity.
-
Use the slider to adjust the Line thickness.
-
Select the Line type, choosing between Solid or Dashed.
-
Use the Line curve drop down menu to select one of the following:
-
Linear: Each point is connected with straight lines.
-
Monotone: Each point is connected with curved lines.
-