# mekko chart properties

mekkochart()

These are the properties used by Qlik Sense mekko charts.

- Since:
    - * Qlik Sense February 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.

### 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.

### 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](https://help.qlik.com/en-US/sense-developer/May2026/Subsystems/EngineJSONAPI/Content/models-hypercubedef.htm).

Properties

#### qDimension

Type: Array

Description: Extends NxDimension, see [Engine API: NxDimension](https://help.qlik.com/en-US/sense-developer/May2026/Subsystems/EngineJSONAPI/Content/models-nxdimension.htm).

Additional properties

* **qDef**

  Type: Object

  Description: Extends NxInlineDimensionDef, see [Engine API: NxInlineDimensionDef](https://help.qlik.com/en-US/sense-developer/May2026/Subsystems/EngineJSONAPI/Content/models-nxinlinedimensiondef.htm).

  qDef properties

  | Name | Type | Description |
  | --- | --- | --- |
  | autoSort | Boolean | Set to automatically sort the dimension.<br><br>Default: true |
  | cId | String | ID used by the client. Must be unique within the current chart. |
  | othersLabel | StringExpressionContainer | String expression container. |

#### qMeasures

Type: Array

Description: Extends NxMeasure, see [Engine API: NxMeasure](https://help.qlik.com/en-US/sense-developer/May2026/Subsystems/EngineJSONAPI/Content/models-nxmeasure.htm).

Additional properties

* **qDef**

  Type: Object

  Description: Extends NxInlineMeasureDef, see [Engine API: NxInlineMeasureDef](https://help.qlik.com/en-US/sense-developer/May2026/Subsystems/EngineJSONAPI/Content/models-nxinlinemeasuredef.htm).

  qDef Properties

  | Name | Type | Description |
  | --- | --- | --- |
  | autoSort | Boolean | Set to automatically sort the measure.<br><br>Default: true |
  | numFormatFromTemplate | Boolean | When enabled, the number format to use can be selected from multiple predefined formats based on the desired type: number or date.<br><br>Default: true |
  | isCustomFormatted | Boolean | Set to true to toggle off the default client formatting. |

#### qInitialDataFetch

Type: Array (InitialPage)

Description: Extends NxPage, see [Engine API: NxPage](https://help.qlik.com/en-US/sense-developer/May2026/Subsystems/EngineJSONAPI/Content/models-nxpage.htm).

Additional properties:

* **qWidth**

  Type: Integer

  Description: Number of columns in the page. The indexing of the columns may vary depending on whether the cells are expanded or not (parameter qAlwaysFullyExpanded in HyperCubeDef ).

  Default: 3

* **qHeight**

  Type: Integer

  Description: Number of rows or elements in the page. The indexing of the rows may vary depending on whether the cells are expanded or not (parameter qAlwaysFullyExpanded in HyperCubeDef ).

  Default: 3333

#### calcCondition

Type: Object

See [Engine API: NxCalcCond](https://help.qlik.com/en-US/sense-developer/May2026/Subsystems/EngineJSONAPI/Content/models-nxcalccond.htm).

#### qSuppressZero

Type: Boolean

Description: Removes zero values.

Default: true

#### qSuppressMissing

Type: Boolean

Description: Removes missing values.

Default: true

### cellColor

Type: Object

Color options for the cells.

#### byDimension

Type: Object (byDimensionConfig)

Dimension settings.

dimension properties

| Name | Type | Description |
| --- | --- | --- |
| type | index \| libraryId \| expression | Type of dimension to use for the coloring.<br><br><ul> <li><span>index</span>: Use an existing dimension in the current hypercube. Which dimension index to use is specified by <span> typeValue</span>.</li> <li><span>libraryId</span>: Use a master dimension. The ID of the master dimension is specified by <span>typeValue</span>.</li> <li><span>expression</span>: Use an expression. The expression is specified by <span>typeValue</span>.</li> </ul> |
| typeValue | Number \| String | The value associated with type. |
| label | String \| qStringExpression | Label indicating what the applied dimension represents. This label will be used as the title for the color legend and be visible in tooltips. |
| persistent | Boolean | Persist colors between selections. |

#### mode

Type: String | byDimension

The coloring mode for the chart's cells. When set to auto, cells will be colored using the second dimension applied in the chart. When set to byDimension, additional settings are applied from cellColor.byDimension.

Default: auto

#### Legend

Type: Object

Legend settings.

legend properties

| Name | Type | Description |
| --- | --- | --- |
| show | Boolean \| String | Set to show the legend. When set to auto, the legend's visibility depends on the size of the chart.<br><br>Default: auto |
| showTitle | Boolean | Show the color legend title.<br><br>Default: true |

## Example using qlik-visual

```
app.visualization.create(
    'mekkochart',
    [
        {
            "qDef": {
                "qFieldDefs": [
                    "Product"
                ]
            },
            "qNullSuppression": true
        },
        {
            "qDef": {
                "qFieldDefs": [
                    "Region"
                ]
            },
            "qNullSuppression": true
        },
        {
            "qDef": {
                "qDef": "Sum(Sales)"
            }
        }
    ],
    {
        "showTitles": true,
        "cellColor": {
            "mode": "byDimension",
            "byDimension": {
                "type": "index",
                "typeValue": 0
            }
        }
    }
).then(function(vis){
    vis.show("QV01");
});
	
```