Strip Chart

A Strip Chart is a timeline-based visualization consisting of segments aligned along a time axis. Each segment corresponds to a specific dimension. The start and end of a segment indicate the beginning and completion of the event being visualized. Segment length reflects the event’s duration.

If the chart includes the current moment in its time range, a dashed vertical line appears—this is the Current time line.

Widget Settings

In addition to the common settings, this widget has unique configuration options.

Data Settings

Dimension

You can add an unlimited number of regular dimensions or a single hierarchical dimension. Only the first dimension in the list—or the one satisfying a display condition—is shown.

Additional parameters:

• Width (in pixels or percent; default: Auto)
• Display (Always / By variable / By formula)
• Color (disabled by default):
  • By values (supports rules with Solid or Custom modes)
  • By rule (only rules based on the added dimension are applicable)

Time

This indicator is not displayed in the widget and is used solely to define the time intervals for visualization.

Indicator parameters:

• Title — when added, the title defaults to the selected column name, as with a regular dimension
• Formula — you can select a column or dimension with Date or DateTime format
• Type — defines whether the value represents the start or end time of the interval (default: end time)
• Column width (px) — controls column width in pixels (min: 70, max: 350)
• Scale — determines the time unit used in the widget: hours (default), days, weeks, months, quarters, or years. If segments don’t fully fit at the selected scale, a horizontal scrollbar appears in Browse mode. When Week is selected, an additional row above the weeks shows the corresponding month and year
• Formatting — controls the time format used in column headers (default: Auto)

Duration

For this indicator, you can select a column with a numeric format.

Indicator parameters:

• Title (defaults to the selected column name)
• Formula

Display settings:

• Data labels (applies to each dimension value; disabled by default. Label size depends on the global text size setting)
• Label position:
  • Auto
  • Inside bars
  • Outside
• Bar color:
  • Auto
  • Solid
  • By duration
  • By rule (supports rules in Solid, By measure, and Custom modes)
  • Custom

Progress

When the Progress indicator is added, a filled portion appears on each segment—representing the elapsed time for that dimension value. The filled length is calculated based on the data in the specified column. The unfilled portion represents remaining time.

Only numeric-format columns can be used for the Progress indicator.

Indicator parameters:

• Title (defaults to the selected column name)
• Formula

Sorting

Standard sorting settings apply to this widget.

Display Settings

Table Header Settings

• Header background: Auto / Solid
• Font weight: Normal / Bold
• Text color: Auto / Solid

Text Size

Controls the text size in widget rows.

Dimension Limit

Determines the number of rows displayed in the widget.

Row Nesting

When enabled, a + icon appears to the left of each row name. Clicking it expands the dimension hierarchy.

Hint

A Hint is a small popup that appears in Browse mode when hovering over a segment. It displays the event name, start and end dates, duration, and completion progress as a percentage (if the Progress indicator is configured). Hints are enabled by default.

Filtering Settings

Standard filtering settings apply to this widget.

Browse Mode

You can navigate between pages using the pagination panel in the bottom-right corner of the widget. This panel appears automatically when the number of rows exceeds the value set in the Dimension limit parameter.

Widget Configuration in YAML

You can edit the widget not only in the visual editor but also in the YAML editor. The table below lists the keys and values available for configuration. For details on working with the value key, see Dimension and measure values in YAML. Supported data formats are described on the relevant page. General widget parameters are covered in Widget configuration in YAML.

Data Settings in YAML

General Settings

Dimensions in YAML (key: dimensions)

Hierarchical Dimension (key: hierarchyDimensions)

Time (key: timeIndicators)

Duration (key: durationIndicators)

Progress (key: progressIndicators)

Display Settings in YAML

Column Height and Width

Widget column height and width are configured in the layout key (height and width). For usage details, refer to Dashboard configuration in YAML.

Other Display Settings

Filtering Settings in YAML

Example of a Configured Widget in the YAML Editor

- key: strip-chart
  apiVersion: "16"
  type: STRIP_CHART
  settings:
    title: Title
    titleSize: 14
    titleColor:
      mode: AUTO
    titleWeight: NORMAL
    showMarkdown: true
    markdownMeasures:
      - name: Average user_id
        value:
          mode: TEMPLATE
          dbType: CH
          tableName: activity_0
          columnName: user_id
          templateName: avg
        dbDataType: FLOAT
        format: NUMBER
        formatting: AUTO
        displaySign: NONE
        displayCondition:
          mode: DISABLED
    markdownText: Widget description
    textSize: 12
    dimensions:
      - name: Hierarchy
        hierarchyDimensions:
          - name: Department
            value:
              mode: FORMULA
              formula: '"progress_example"."Department"'
            dbDataType: STRING
            format: STRING
            formatting: AUTO
            displayCondition:
              mode: DISABLED
            color:
              mode: DISABLED
            width:
              value: null
              mode: PIXEL
          - name: Employee
            value:
              mode: FORMULA
              formula: '"progress_example"."Employee"'
            dbDataType: STRING
            format: STRING
            formatting: AUTO
            displayCondition:
              mode: DISABLED
            color:
              mode: DISABLED
            width:
              value: null
              mode: PIXEL
        displayCondition:
          mode: DISABLED
        color:
          mode: DISABLED
        width:
          value: 70
          mode: PIXEL
    filters: []
    displayCondition:
      mode: DISABLED
    timeIndicators:
      - name: Date (Event date)
        dbDataType: DATE
        format: DATE
        rangeSide: START
        value:
          mode: FORMULA
          formula: '"progress_example"."Event date"'
    durationIndicators:
      - name: Duration
        format: NUMBER
        color:
          mode: BASE
          value: "#078936"
        withLabel: true
        value:
          mode: FORMULA
          formula: '"progress_example"."Duration"'
    progressIndicators:
      - name: Progress
        format: NUMBER
        value:
          mode: FORMULA
          formula: '"progress_example"."Progress"'
    withHint: true
    limit: 10
    withPagination: true
    scale: day
    formatting: auto
    formattingTemplate: ""
    filterMode: DEFAULT
    pageSize: 2
    columnWidth: 70
    sorting: []
    appearance:
      enabled: true
      horizontalPaddings: "40"
      verticalPaddings: "40"
      cornerRadius: "7"