Documentation Docs
Documentation Docs

IVisualizationPanelOptions

Visualization Panel configuration. Pass it as the third argument to the VisualizationPanel constructor:

import { VisualizationPanel } from "survey-analytics";

const vizPanel = new VisualizationPanel(
  surveyQuestions,
  surveyResults,
  vizPanelOptions
);

Allows users to sort answers by answer count. Applies only to bar charts, histograms, and statistics tables.

This property adds a Sorting dropdown to each supported visualizer.

Default value: true

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions
See also:
answersOrder
allowDragDrop property

Specifies whether users can drag and drop charts. Applies only if allowDynamicLayout is true.

Default value: true

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions
See also:
layoutEngine

Specifies whether to arrange charts based on the available screen space and allow users to reorder them via drag and drop.

If this property is disabled, charts are displayed one under another, and users cannot drag and drop them. If you want to disable only drag and drop, set the allowDragDrop property to false.

Default value: true

View Demo

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions
See also:
layoutEngine

Allows users to hide answers with zero count in bar charts, histograms, and statistics tables.

This property adds a Hide Empty Answers button to each supported visualizer.

Default value: false

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions

Allows users to change the visibility of individual charts.

This property adds a Hide button to each chart.

Default value: true

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions
allowSelection property

Allows users to cross-filter charts. The filter applies when users select a series point.

Default value: true

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions

Allows users to show the number of respondents who did not answer a particular question.

This property adds a Show Missing Answers button to each chart.

Default value: false

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions

Allows users to switch between absolute and percentage values in bar charts.

This property adds a Show Percentages button to each bar chart.

Default value: false

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions
See also:
showPercentages * , showOnlyPercentages * , percentagePrecision
allowTopNAnswers property

Allows users to select whether to show top 5, 10, or 20 answers by answer count.

This property adds a Top N Answers dropdown to each chart.

Default value: false

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions

Allows users to transpose a visualized matrix question.

This property adds a Transpose button to charts that visualize matrixes. When users select Per Values, matrix rows go to chart arguments and matrix columns form chart series. When users select Per Columns, matrix rows form chart series and matrix columns go to chart arguments.

Default value: false

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions
answersOrder property

Specifies how to sort answers in bar charts, histograms, and statistics tables.

Accepted values:

  • "default" (default) - Do not sort answers.
  • "asc" - Sort answers by ascending answer count.
  • "desc" - Sort answers by descending answer count.

Users can change this property value if you enable the allowChangeAnswersOrder property.

Type:
"default" | "asc" | "desc" readonly
Implemented in:
IVisualizationPanelOptions
See also:
allowChangeAnswersOrder
dataProvider property

A common data provider for all visualizers.

Type:
DataProvider readonly
Implemented in:
IVisualizationPanelOptions
defaultChartType property

Default chart type.

Accepted values depend on the question type as follows:

  • Boolean: "bar" | "vbar" | "pie" | "doughnut"
  • Date, Number: "bar" | "vbar"
  • Matrix: "bar" | "vbar" | "pie" | "doughnut" | "stackedbar"
  • Rating: "bar" | "vbar" | "gauge" | "bullet"
  • Radiogroup, Checkbox, Dropdown, Image Picker: "bar" | "vbar" | "pie" | "doughnut"

To set a type for an individual chart, access this chart in the visualizers array and set its chartType property to one of the values described above:

const vizPanel = new SurveyAnalytics.VisualizationPanel( ... );
vizPanel.visualizers[0].chartType = "stackedbar";
Type:
string readonly
Implemented in:
IVisualizationPanelOptions
hideEmptyAnswers property

Hides answers with zero count in bar charts, histograms, and statistics tables.

Users can change this property value if you enable the allowHideEmptyAnswers property.

Default value: false

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions
See also:
allowHideEmptyAnswers

The number of label characters after which truncation starts.

Set this property to -1 to disable truncation.

Default value: 27

Type:
number readonly
Implemented in:
IVisualizationPanelOptions
layoutEngine property

A layout engine used to arrange charts on the Visualization Panel.

You can use this property to integrate a third-party layout engine with SurveyJS Dashboard.

Type:
LayoutEngine readonly
Implemented in:
IVisualizationPanelOptions
See also:
allowDynamicLayout

Specifies percentage precision.

Default value: 0

Type:
number readonly
Implemented in:
IVisualizationPanelOptions
See also:
allowShowPercentages * , showPercentages * , showOnlyPercentages

Specifies whether bar charts display only percentages, without absolute values.

Applies only if the allowShowPercentages or showPercentages property is enabled.

Default value: false

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions
See also:
allowShowPercentages * , showPercentages * , percentagePrecision
showPercentages property

Specifies whether bar charts display percentages in addition to absolute values.

Users can change this property value if you enable the allowShowPercentages property.

Default value: false

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions
See also:
allowShowPercentages * , showOnlyPercentages * , percentagePrecision

Removes HTML tags from survey element titles.

Survey element titles can contain HTML markup and are specified by users. An attacker can inject malicious code into the titles. To guard against it, keep this property set to true.

Default value: true

Type:
boolean readonly
Implemented in:
IVisualizationPanelOptions
survey property

Pass a survey instance to use survey locales in the Visualization Panel.

Type:
SurveyModel readonly
Implemented in:
IVisualizationPanelOptions

Copyright © 2024 Devsoft Baltic OÜ. All rights reserved.

Your cookie settings

We use cookies on our site to make your browsing experience more convenient and personal. In some cases, they are essential to making the site work properly. By clicking "Accept All", you consent to the use of all cookies in accordance with our Terms of Use & Privacy Statement. However, you may visit "Cookie settings" to provide a controlled consent.

Your renewal subscription expires soon.

Since the license is perpetual, you will still have permanent access to the product versions released within the first 12 month of the original purchase date.

If you wish to continue receiving technical support from our Help Desk specialists and maintain access to the latest product updates, make sure to renew your subscription by clicking the "Renew" button below.

Your renewal subscription has expired.

Since the license is perpetual, you will still have permanent access to the product versions released within the first 12 month of the original purchase date.

If you wish to continue receiving technical support from our Help Desk specialists and maintain access to the latest product updates, make sure to renew your subscription by clicking the "Renew" button below.