Skip to main content Skip to complementary content

container properties

Information noteSTABLE.

This API is reliable and breaking changes are unlikely.

container()

These are the properties used by Qlik Sense containers.

Version history

Version history
Version state Details
Introduced June 2019

Properties

showTitles

Type: Boolean

Show title for the visualization.

Default: true.

showDetails

Type: Boolean

Sets if visualization details should be shown.

Default: false

title

Type: String | qStringExpression

Visualization title shown if "showTitles": true.

subtitle

Type: String | qStringExpression

Visualization subtitle shown if "showTitles": true.

footnote

Type: String | qStringExpression

Visualization footnote shown if "showTitles": true.

disableNavMenu

Type: Boolean

Disables the hover menu in the visualization.

Default: false

showTabs

Type: Boolean

Controls whether the container tab row is shown or not. If set to false, the tab row is no longer visible and only the top chart appears.

Default: true

useDropdown

Type: Boolean

Controls whether a menu button appears when there is not enough space for all tabs.

Default: true

useScrollButton

Type: Boolean

Controls whether navigation arrows appear when there is not enough space for all tabs.

Default: true

showIcons

Type: Boolean

If set to true, chart icons are displayed on each tab.

Default: false

borders

Type: String

Controls whether the borders of the objects inside the container will be shown or hidden. The setting applies to all charts inside the container. Value can be set to one of:

  • auto
  • noBorder
  • border

Default: auto

Example using Visualization API

In this example, we want to create a container and add visualizations to it.


var bar = app.visualization.create('barchart', ["Dim1","=num([Expression1])"],{ title:"Great on-the-fly barchart" });
var line = app.visualization.create('linechart', ["Dim1","=Sum([Expression1])"],{ title:"Great on-the-fly linechart" });
var pie = app.visualization.create('piechart', ["Dim2", "=Sum([Expression2])"], { title: "Great on-the-fly piechart" });
Promise.all([pie, bar, line]).then(function(data) {
    app.visualization.create('container', null, {
        title: 'My container',
        showTitles: true 
    }).then(function(container) { 
        for (var i = 0; i < data.length; i++) {
            data[i].model.getProperties().then(function(child) {
                container.model.createChild(child);
            });
        }
        container.show("QV02");
    });
});
A piechart with several colors. The piechart is titled "Great on-the-fly piechart". The most prominant color is purple, which is labelled "f". The second most prominent color is light blue, which has no label. The third most prominent color is green, which is labelled "d". The fourth most prominent color is yellow, which is labelled as "c". The fifth most prominent color is orange, which has no label. The sixth most prominent color is pink, which has no label.

Did this page help you?

If you find any issues with this page or its content – a typo, a missing step, or a technical error – let us know how we can improve!