Combo Chart Properties
The property panel contains all configuration settings for your Vizlib Combo Chart, organized into data, data handling, sorting, reference lines, appearance, viztips, and interactivity sections.
This topic contains the following sections:
Data (Dimensions and Measures)
Vizlib Combo Chart supports one dimension with multiple measures. In the Data section, you can add dimensions or measures dynamically and decide whether they should be used directly or be added as alternatives.
Dimensions
When you add a Dimension, you can choose a Field and add a custom Label, choose to Include null values, set a data Limitation, choosing from Fixed number (e.g. top 10 values only), Exact value or Relative value (e.g. only show values above 50%). You can also choose to Show others (other values outside the scope of the dimension) and to only display the dimension if a Calculated Condition is met. You can also add a Master Item.
Figure 1: Dimensions
Measures
When you add a Measure, you can set an Expression for the measure, add a Label, select a Number formatting option, and enter a Format pattern. You can also choose to enter a Calculated condition, set the Axis Position and choose to Show Measure Label.
Figure 2: Measure
If the measure has been created from a Master Item, you can choose to enable Master measure formatting, which means formatting for the measure will be taken from the master item definition (you can find master items in the Custom Objects menu in the left hand panel).
Measure Representation Types
You can choose between four types of Representation for your measure: Bar, Line, Icon and Symbol. Each have their own formatting settings.
Bar
When you choose Bar, you can choose to choose the Background color or image, and set the Bar opacity.
Figure 3: Bar
Enabling a Benchmark allows you to create another bar layer behind the existing bars. You can set a Benchmark Value (which can also be an expression), and defines the Benchmark Width, and Benchmark Alignment. You can enter a Custom Tooltip (HTML supported), and choose to Accumulate values (useful for time dimensions if you need to see increments). You can also add a Master Item.
Figure 4: Benchmark, Tooltip, Accumulate Values
Line
If you choose a Line representation type, you can set the Line Width, the Line Style, Line Curve Style, and turn the line into an area chart with Type.
Figure 5: Line
You can also choose to Show Values, set the Line Color, Line Opacity, enter a Custom Tooltip (HTML supported), and choose to Accumulate values (useful for time dimensions if you need to see increments). You can also add a Master Item.
Figure 6: Show Values, Tooltip, Accumulate Values
Symbol
If you choose a Symbol representation type, you can choose a symbol from the drop-down, and set the Symbol Size, the Symbol Color, and Symbol Opacity.
Figure 7: Symbol
You can also choose to show Data Values, enter a Custom Tooltip (HTML supported), and choose to Accumulate values (useful for time dimensions if you need to see increments). You can also add a Master Item.
Figure 8: Data Values, Custom Tooltip, Accumulate Values
Icon
If you choose an Icon representation, you can choose a icon using the picker or an expression, and set the Symbol Size, the Icon Color, and Icon Opacity.
Figure 9: Icon
You can also choose to show Data Values, enter a Custom Tooltip (HTML supported), and choose to Accumulate values (useful for time dimensions if you need to see increments). You can also add a Master Item.
Figure 10: Show Values, Custom Tooltip, Accumulate Values
Data Handling, Sorting
These settings control how data is handled and ordered in the Vizlib Combo Chart.
Data Handling
Data Handling contains settings relating to the data in the object. You can control the Data downloading limit, Suppress Zero Values, enter a Calculation condition using the editor, and also enter a message to display if the calculation is not fulfilled.
Figure 11: Data Handling
Sorting
The Sorting tab controls how you order your data and has a default setting of Auto for both dimensions and measures. You can switch to Custom sorting if you'd like to set your own values and Sort by expression, numerically or alphabetically.
Figure 12: Sorting
Reference Lines
Vizlib Combo Chart supports Reference Lines for both the x- and y-Axis.
Label
If you choose to add a Reference Line, you can enter a Dimension Value, customize a Label, and set the Font Color, Font Size, Text Opacity, Font Style, and choose how to Align the label.
Figure 13: Label
Outline
If you choose to enable an Outline, you can set the Outline Background, Outline Border, Outline Stroke Width and Outline Border Radius.
Figure 14: Outline
Line
You can also choose a Line Color, and set the Line Width, Line Opacity, Line Style, and Line Position. You can also choose to Always show the reference line, or show it only if a Condition is met.
Figure 15: Line
Example
The following example shows a Reference Line.
Figure 16: Reference Line Example
Appearance
The Appearance settings control the look and feel of your Vizlib Combo Chart.
General
In the General section, you can display a Title, Subtitle and Footnote. You can also choose to Toggle off Hover Menu, and Show Details.
Figure 17: General
Presentation
In the Presentation settings you can select the Orientation and Direction, set the Groupbar Width and Radius in Bars Formatting, and also choose to Show Null Values.
Figure 18: Presentation
Colors and Legend
With the Colors and Legend settings, the default color setting is Auto, which inherits colors from master items (master measures and master dimensions), with plans to implement support for master item colors for dimension values. When you enable the Custom setting, you'll see the option to Use Custom Colors, where you can enter you own color palette. If you select Use Color Scheme, you can choose from Single Color (all chart items are the same color), Multicolored (the chart is colored to a defined color scheme), or color By measure (colors are set by the measures selected).
Figure 19: Colors
You can also choose to reverse the order of the colors in your palette by choosing Reverse Colors, and have a value keep its color after it's selected by enabling Persistent Colors. There is also a customization option for Null Value Colors.
If you switch Show Legend to On, the Legend settings allow you to set the Legend Position, Align the legend, choose a Legend Font Color, and Font Size. You can manage sorting settings with Sort Legend By, choose the sort order (Asc. or Desc.), customize a Char limit, and choose to Show Legend Title, setting the Legend Title Color, Legend Title Font Size and Legend Title Font Style.
Figure 20: Legend
Grid Format
The Grid Format settings allow you to display a Grid, select the Grid for Y-Axis, set a Grid Style, Grid Color, Grid Opacity and Grid Thickness.
Figure 21: Grid Format
X-Axis
X-axis settings allow you to make changes to the way the x-axis in the combo chart is displayed. In the X-axis settings you enable the axis display with Show/Hide, set the Axis Position, show a Dimension Title, change axis Label, set the Color, choose the Label Font Size and Font Style, set a Character Limit, and select options to Show alternative count and Show drilldown breadcrumbs.
Figure 22: X-Axis
You can also set the Dimension Labels Position, customize a Char Limit for the label, and use Axis Styling to set the Font Color, Font Size, and the Axis Line Color and Axis Thickness.
Figure 23: Axis Styling
Y-Axis
Y-axis settings allow you to make changes to the way the y-axis in the combo chart is displayed. You can enable the axis display with Show/Hide, set the Axis Position, show a Dimension Title, change axis Label, set the Font Color, choose the Label Font Size and Label Font Style, set a Character Limit, and select options to Show alternative count and Show drilldown breadcrumbs.
Figure 24: Y-Axis
You can use Axis Styling to set the Font Color, Font Size, and the Axis Line Color and Line Thickness. You can also choose to customize a Ticks Count, choose an Axis Tick Format, control the display for a Negative Format, and enable a Currency Format. You can select an Axis Range, and enable min/max smoothing to ensure the axis begins and ends with an appropriate rounded integer value, and choose Display zero reference line to show a zero value. Y-Axis Margin controls the scatter chart margin, increasing or decreasing the amount of empty space around the edges of the chart (margins are not available for a Min/Max Y-axis range).
Figure 25: Axis Styling
Viztips and Tooltips
The Viztips and Tooltips settings help you to manage tooltips in Vizlib Combo Chart, and you can also enable Viztips to add dynamic tooltips. If you'd like to find out more about Viztips, you can find our overview article here.
Viztips and Tooltips
To display Tooltips, you need to move the slider to Enabled, and then you can select the Viztips option to start working with dynamic tooltips. There's also a link to the Viztips tutorial if you need to check anything.
Figure 26: Viztips and Tooltips
Viztips Content
Viztips Content settings contain a drop-down where you select the master item, and includes a copy function for Viztips placeholder tags and a further link to the tutorial.
Figure 27: Viztips Content
Viztips Settings
With Viztips Settings, you can use the sliders to change the height and width of the Viztips object in the chart.
Figure 28: Viztips Settings
Interactivity and Alternate State
The Interactivity settings allow you to choose how users interact with Vizlib Combo Chart.
Interactivity
In the Interactivity menu, you can choose to Allow Selections in the chart when in analysis mode, enable Multiselect mode, show a Warning Message, and show an Extended Context Menu, with options to switch to a Horizontal (or Vertical) chart, Hide Legend, Disable Scroll Preview, Data Values, and Hide Grid. You can also enable a Full screen Icon and Take Snapshot Icon.
Note: The snapshot icon has been part of the Hover Menu since the Qlik Sense September 2020 release, and is no longer controlled using the property panel.
Figure 29: Interactivity
Alternate State
Alternate State permits you to assign the Vizlib Combo Chart to an alternate selection state. You can find more information about working with alternate states here.
Figure 30: Alternate States