Skip to main content Skip to complementary content

bulletchart properties

Warning noteEXPERIMENTAL.

This API is under development. Do not rely on it. It may change or be removed in future versions.

These are the properties used by Qlik Sense bullet charts. For more information about bullet charts and how they are used, see Bullet chart.

Version history

Version history
Version state Details
Introduced June 2020

Properties

version

Type: String

Current version of this generic object definition.

Default: 1.0.0

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

qHyperCubeDef

Type: Object

The hypercube definition used by most visualizations.

A subset of the properties available in the qHyperCubeDef is presented here. These properties are either required or have different defaults than those of the engine API. For complete documentation of all available properties, see Engine API: HyperCubeDef.

qDimensions

Type: Array

Description: Extends NxDimension, see Engine API: NxDimension.

  • qDef

    Type: Object

    Description: Extends NxInlineDimensionDef, see Engine API: NxInlineDimensionDef.

    qDef properties
    Name Type Description
    autoSort Boolean

    Set to automatically sort the dimension.

    Default: true

    cId String ID used by the client. Must be unique within the current chart.
    othersLabel StringExpressionContainer String expression container.

  • qAttributeExpressions

    Type: Array

    Description: Extends NxAttrExprDef, see Engine API: NxAttrExprDef.

    • id

      Type: String

      Description: All qAttributeExpressions IDs are specifically for use with custom tooltips.

      • customTooltipExpression: An AttributeExpression with this ID sets the extra tooltip measure.
      • customTooltipTitle: An AttributeExpression with this ID sets the tooltip title.
      • customTooltipDescription: An AttributeExpression with this ID sets the tooltip description.
      • customTooltipImages: An AttributeExpression with this ID sets the tooltip image.

qMeasures

Type: Array

Description: Extends NxMeasure, see Engine API: NxMeasure.

Information noteThe maximum number of measures that can be set for this chart type is 15.
  • qDef

    Type: Object

    Description Extends NxInlineMeasureDef, see Engine API: NxInlineMeasureDef.

    • autoSort

      Type: Boolean

      Description: Set to automatically sort the measure. Default: true.

    • cId

      Type: String

      Description: ID used by the client. Must be unique within the current chart.

    • isCustomFormatted

      Type: Boolean

      Description: Set to true to toggle off the default client formatting.

    • numFormatFromTemplate

      Type: Boolean

      Description: When enabled, the number format to use can be selected from multiple predefined formats based on the desired type: number or date. Default: true.

    • othersLabel

      Type: StringExpressionContainer

    • useSegments

      Type: Boolean

      Description: Set to true to customize segment colors. Default: false

    • conditionalColoring

      Type: Object

      Description: Information about limits and colors for segments.

      • segments

        Type: Object

        • limits

          Type: Array

          • value

            Type: Integer or ValueExpression

            Description: Numerical value for the limits between the color segments in the chart.

          • gradient

            Type: Boolean

            Description: Set gradient of the color. Default: false

        • paletteColors

          Type: Array

          paletteColors properties
          Name Type Description
          index Integer

          Index in the palette.

          The default Qlik Sense color palette:

          • -1: set to use custom color that is not in the palette.
          • 0: No color
          • 1: White, HEX: #ffffff
          • 2: Light green, HEX: #46c646
          • 3: Green, HEX: #276e27
          • 4: Light blue, HEX: #b6d7ea
          • 5: Blue, HEX: #7db8da
          • 6: Dark blue, HEX: #4477aa
          • 7: Purple, HEX: #8e477d
          • 8: Yellow, HEX: #ffcf02
          • 9: Orange, HEX: #f8981d
          • 10: Red, HEX: #f93f17
          • 11: Brown, HEX: #633d0c
          • 12: Light gray, HEX: #b0afae
          • 13: Gray, HEX: #7b7a78
          • 14: Dark gray, HEX: #545352
          • 15: Black, HEX: #000000

          Default: 6

          color String

          Color as HEX string.

          Mandatory if "index": "-1".

    • autoMinMax

      Type: Boolean

      Description: Set to true to customize the ranges of measure. Default: false

    • minMax

      Type: String

      Description: Set custom max/min. Default \"min\". Supported type are: 'min'|'max'|'minMax'.

    • min

      Type: Integer or ValueExpression

      Description: Set the min value of the range.

    • max

      Type: Integer or ValueExpression

      Description: Set the max value of the range.

     

  • qAttributeExpressions

    Type: Array

    Description: Extends NxAttrExprDef, see Engine API: NxAttrExprDef.

    • id

      Type: String

      Description: If set to `\"bullet-target\"` the expression will be interpreted as the target for the specific measure. If set to `\"bullet-segment\"` the expression will be interpreted as a segment limit.

qSuppressMissing

Type: Boolean

Description: Removes missing values. Default: true

qSuppressZero

Type: Boolean

Description: Removes zero values. Default: false

color

Type: Object

Description: Color settings. Most color options for visualizations are set in the color object in the options. You activate custom coloring by setting auto: false, which turns off auto-coloring. If auto: true, no other properties need to be defined in the color object.

The following parameters can be set in the color object:

color properties
Name Type Description
auto Boolean

Description: Set to use automatic coloring. When set to true, color settings are based on the visualization used. Default: true

paletteColor Object

Description: Color information structure. Holds the actual color and index in palette.

  • color:

    Type: String

    Description: Color as hex string (mandatory if index: -1)
  • index:

    Type: Integer

    Description: Index in palette.
mode String

Description: Sets the coloring mode for the visualization when auto-coloring has been switched off (auto: false).

Default: primary

Can be one of:

  • primary:

    Type: Object

    Description: A single color (by default blue) is used for all items in the chart. In visualizations that do not benefit from multiple colors, for example, bar charts with one dimension and scatter plots, single color is the default setting.

  • byExpression

    Type: Object

    Description: Coloring is based on an expression, which in most cases is a color code. Details are set in the expressionIsColor properties.

target Object

Description: The target object is used to define the color of target. Default: { index: -1, color: '#000000' }

Properties:

  • paletteColor:

    Type: Object

    Description: Color information structure. Holds the actual color and index in palette.

    • color:

      Type: String

      Description: Color as hex string (mandatory if index: -1)
    • index:

      Type: Integer

      Description: Index in palette.

tooltip

Type: Object

Description: Custom tooltip settings.

  • auto

    Type: Boolean

    Description: Determines if the custom tooltip is displayed or not.

    If set to false, custom tooltip is displayed. Default: true

  • data
  • hideBasic

    Type: Boolean

    Description: Hides all the basic tooltip content except the dimension and the custom tooltip content.

    If set to true, basic tooltip content is hidden. Default: false

  • chart

    Type: Object

    Description: The chart objects are used to define the chart that is displayed by the custom tooltip.

    • object

      Type: MasterVisualizationChartObject

      Description: Contains the master visualizations available to add to the tooltip.

      • refId

        Type: String

        Description: Input field containing the qExtendsId of the visualization, where qExtendsId is the unique id of the master visualization.

    • style

      Type: MasterVisualizationChartStyle

      Description: Determines the styling available for the chart in the tooltip.

      • size

        Type: String

        Description: Size of the chart when it is displayed. One of:

        • small
        • medium
        • large

        The small, medium, and large settings yield fixed pixel sizes for the chart container. The chart is scaled to fit the tooltip.

  • imageComponents

    Type: Array

    Description: The imageComponents objects are used to define the images displayed by the custom tooltip.

    • type

      Type: String

      Description: Type of the image for the current selection. One of:

      • media library
      • url
    • size

      Type: String

      Description: Size of the image when it is displayed. One of:

      • small
      • medium
      • large
      • original

      The small, medium, and large settings yield fixed pixel sizes for the image container. Setting the value to original maintains the size unless it exceeds the limit of the tooltip max size. The image is scaled to fit the tooltip if it exceeds the limit.

    • ref

      Type: String, StringExpression, or MediaLibraryRef

      Description: The reference value of the image.

      • MediaLibraryRef

        Type: Object

        Description: Media Library Reference structure.

        • qStaticContentUrlDef

          Object

          Description: Media Library structure that is evaluated by the engine.

          • qUrl
          • Type: String

            Description: Media library path for the image in the app. Used only when type is set to media library.

dimensionAxis

Type: Object

Dimension axis settings.

dimensionAxis properties
Name Type Description
show String

Defines if titles and labels should be visible. Can be one of:

  • all
  • labels
  • title
  • none

Default: all

label String

Defines the label orientation. Can be one of:

  • auto
  • horizontal
  • tilted

Default: auto

dock String

Axis docking position. Can be:

  • near
  • far

Default: near

gridLine

Type: Object

Grid line settings.

gridLine properties
Name Type Description
auto Boolean

Set to use automatic grid line spacing.

Default: true

spacing Integer

Grid line spacing. Used only when "auto": false. One of:

  • 0: no lines
  • 1: wide
  • 2: medium
  • 3: narrow

Default: 2

measureAxis

Type: Object

Measure axis settings.

measureAxis properties
Name Type Description
show String

Set to display the labels and titles. Can be one of:

  • all
  • labels
  • title
  • none

Default: all

dock String

Sets the axis docking position. Can be one of:

  • near
  • far

Default: near

spacing Number

Set the axis scale:

Default: 1

commonAxis Boolean

When set to true, use common axis.

Default: false

commonRange Boolean

When set to true, use common range.

Default: false

orientation

Type: String

Orientation settings. Can be:

  • horizontal
  • vertical

If vertical, the dimension axis can only be docked on bottom or top and measure axis on left or right.

Default: vertical

scrollbar

Type: String

Set the styling of the scroll bar. Can be one of:

  • bar
  • none

Default: bar

scrollStartPos

Type: Number

Scroll Alignment. Generally decides if the scroll starts at the beginning or end of the data.

  • 0: the scroll bar starts at the left/top of the chart
  • 1: the scroll bar starts at the right/bottom of the chart

dataPoint

Type: Object

Data point settings.

dataPoint properties
Name Type Description
showLabels Boolean

Set to show labels on data points.

Default: false

showSegmentLabels Boolean

Set to show labels on segments (only for stacked bar charts).

Only applicable if showLabels is set to true.

showTotalLabels Boolean

Set to show total labels (only for stacked bar charts).

Only applicable if showLabels is set to true.

Example

In this example, we want to create a simple bullet-chart with two measures, three color segments (two limits) and a target. The limits and target are hard-coded numbers.

app.visualization.create(
    "bulletchart",
    [
        {
            qLibraryId: "",
            qDef: {
                qDef: "Sum(SalesDenmark)",
                qLabel: "Denmark",
                useSegments: true,
                conditionalColoring: {
                    segments: {
                        limits: 
                        [
                            {
                                value: 150000,
                            },
                            {
                                value: 250000,
                            },
                        ],
                        paletteColors: 
                        [
                            {
                                color: "#959291",
                            },
                            {
                                color: "#adaca9",
                            },
                            {
                                color: "#d7d6d5",
                            },
                        ],
                    },
                },
                autoMinMax: true,
            },
            qAttributeExpressions: 
            [
                {
                    qExpression: "290000",
                    qLibraryId: "",
                    qAttribute: true,
                    id: "bullet-target",
                },
                {
                    qExpression: "150000",
                    qLibraryId: "",
                    qAttribute: true,
                    id: "bullet-segment",
                },
                {
                    qExpression: "245000",
                    qLibraryId: "",
                    qAttribute: true,
                    id: "bullet-segment",
                },
            ],
        },
        {
            qLibraryId: "",
            qDef: {
                qDef: "Sum(SalesSweden)",
                qLabel: "Sweden",
                useSegments: true,
                conditionalColoring: {
                    segments: {
                        limits: [
                            {
                                value: 180000,
                            },
                            {
                                value: 275000,
                            },
                        ],
                        paletteColors: [
                            {
                                color: "#959291",
                            },
                            {
                                color: "#adaca9",
                            },
                            {
                                color: "#d7d6d5",
                            },
                        ],
                    },
                },
                autoMinMax: true,
            },
            qAttributeExpressions: 
            [
                {
                    qExpression: "281000",
                    qLibraryId: "",
                    qAttribute: true,
                    id: "bullet-target",
                },
                {
                    qExpression: "180000",
                    qLibraryId: "",
                    qAttribute: true,
                    id: "bullet-segment",
                },
                {
                    qExpression: "275000",
                    qLibraryId: "",
                    qAttribute: true,
                    id: "bullet-segment",
                },
            ],
        },
    ],
    {
        title: "Sales target",
    }
)
.then(function (vis) {
    vis.show("QV01");
});
	
A bar graph titled "Sales target" showing Sweden's Sales target one third of the way to 300k from 140k while Denmark is just above 140k.

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!