Menu
Download Free Trial
  1. API reference
  2. Welcome
    1. Component overview
    2. Quickstart
    3. System requirements
    4. Troubleshooting
    5. Managing license keys
  3. Connecting to Data Source
    1. JSON
      1. Connecting to JSON
      2. Data types in JSON
    2. CSV
      1. Connecting to CSV
      2. Connecting to CSV using Compressor
      3. Data types in CSV
    3. Database
      1. Connecting to SQL databases
      2. Connecting to other databases
      3. Connecting to database with .NET
      4. Connecting to database with .NET Core
      5. Connecting to database with Java
      6. Connecting to database with PHP
    4. Microsoft Analysis Services
      1. Connecting to Microsoft Analysis Services
      2. Getting started with Accelerator
      3. Installing Accelerator as a Windows Service
      4. Referring Accelerator as a DLL
      5. Configuring authentication process
      6. Configuring secure HTTPS connection
      7. Troubleshooting
    5. Pentaho Mondrian
      1. Connecting to Pentaho Mondrian
      2. Getting started with Accelerator
      3. Configuring Mondrian roles
      4. Сonfiguring username/password protection
      5. Сonfiguring secure HTTPS connection
      6. Troubleshooting
    6. icCube
  4. Configuring report
    1. What is a report
    2. Data source
    3. Slice
    4. Options
    5. Number formatting
    6. Conditional formatting
    7. Set report to the component
    8. Get report from the component
    9. Date and time formatting
    10. Configuring global options
    11. Export and print
    12. Calculated values
    13. Custom sorting
  5. Integration with frameworks
    1. Available tutorials
    2. Integration with jQuery
    3. Integration with AngularJS
    4. Integration with Angular 2
    5. Integration with Angular 4+
    6. Integration with React
    7. Integration with Webpack
    8. Integration with RequireJS
    9. Integration with TypeScript
    10. Integration with ASP.NET
    11. Integration with JSP
    12. Integration with PhoneGap
  6. Integration with charts
    1. Integration with Highcharts
    2. Integration with FusionCharts
    3. Integration with Google Charts
    4. Integration with any charting library
  7. Customizing
    1. Customizing toolbar
    2. Customizing appearance
    3. Localizing component
  8. Updating to the latest version
    1. Updating to the latest version
    2. Release notes
    3. Migration guide from 2.4 to 2.5
    4. Migration guide from 2.3 to 2.4
    5. Migration guide from 2.2 to 2.3
  9. Older Versions
    1. Documentation 2.3
    2. Documentation 2.2
    3. API reference - Flex
Table of contents

Options

The way how Pivot Component looks can be defined within the report. Options are used to specify appearance and functionality available for customers. For example, you can show/hide from the UI such features as filters and sorting controls, define date patterns or enable/disable drill through.

Options are defined in options object inside report. If no options are specified, Pivot Component will use the default options. This tutorial explains which options are available and how to use them.

Our default options are defined automatically, so you need to define only options you want to modify. All options can be divided into three smaller groups:

  1. Grid options – define how grid looks and its functionality
  2. Chart options – define how charts look and their functionality
  3. General options – define options applicable to the whole component

The way how options can be set is described in How to set options section. Default options section contains an example of Flexmonster Pivot default options.


Grid options

All grid options are combined in grid section of options object.

See the list of available grid options
grid.type String. Selected grid type. The following grid types are supported: "compact", "classic" and "flat".
grid.title String. Title of the grid.
grid.showFilter Boolean. Indicates whether the opening columns/rows filter controls and page filter controls are visible (true) or not (false) on the grid. Default value is true.
grid.showHeaders Boolean. Indicates whether the spreadsheet headers are visible (true) or not (false).
grid.showTotals String. Specifies how to show totals: in rows ("rows"), in columns ("columns"), in rows and columns ("on") or hide them ("off"). Default value is "on".
grid.showGrandTotals String. Specifies how to show grand totals: in rows ("rows"), in columns ("columns"), in rows and columns ("on") or hide them ("off"). Default value is "on".
grid.grandTotalsPosition String. Indicates whether the grand totals are displayed on the top of pivot table ("top") or on the bottom ("bottom"). The default value is "top". Only for the flat view.
grid.showHierarchies Boolean. Specifies how to show drillable hierarchy cells on the grid: with link on the right (true) or with icon on the left (false). Default value is true.
grid.showHierarchyCaptions Boolean. Indicates whether the hierarchy captions are visible (true) or not (false) on the grid. Default value is true.
grid.showReportFiltersArea Boolean. Indicates whether the reports filtering cells on the grid should be visible (true) or not (false). Default value is true.
grid.drillthroughMaxRows Number. Allows setting the maximal number of rows for the MSAS Drill Through popup. Supported only via XMLA protocol. The default value is 1000.
Check live demo showing grid options
Chart options

All chart options are combined in chart section of options object.

See the list of available chart options
chart.type String. Selected chart type. The following chart types are supported: "bar", "bar_h" (Horizontal Bar), "line", "scatter", "pie", "bar_stack" and "bar_line" (starting from v1.9).
chart.title String. Title of the chart.
chart.showFilter Boolean. Indicates whether the opening columns and rows filter controls are visible (true) or not (false) on the charts. Default value is true.
chart.multipleMeasures Boolean. Starting from v1.9. Indicates whether to show multiple measures on charts. Default value is false.
chart.oneLevel Boolean. In a case of a drillable chart, defines whether the chart shows all nodes on the x-axis and the legend (false) or only the lowest expanded node on the x-axis and on the legend (true). Default value is false.
chart.autoRange Boolean. Indicates whether the range of values on the charts is selected automatically or not.
chart.showLegendButton Boolean. Indicates whether the button to show/hide the legend on charts is visible. Default value is false which means that the legend is always visible, without the button that hides it.
chart.showAllLabels Boolean. Setting a value to true allows showing all the labels in Pie сhart. If the value is false it will have the same behavior as it was before. Default value is false.
chart.showMeasures Boolean. Hides all dropdowns on the top of charts if you want to show simple chart without controls or you want to save space. Default value is true – the dropdowns are visible by default, as it was in previous versions.
chart.showOneMeasureSelection Boolean. The default value is true, which means that the visibility of the measures dropdown on charts does not depend on the amount of measures in it. If the value is set to false, the measures dropdown on charts will be hidden if there is only one measure in the list and visible if there are two or more measures.
chart.showWarning Boolean. Indicates whether the warning are shown if data is too big for charts.
chart.position String. Position of charts related to the grid. It can be "bottom", "top", "left" or "right". Default value is "bottom".
chart.activeMeasure String. Selected measure on charts view.
chart.pieDataIndex String. Selected tuple index on the Pie chart.
Check live demo showing chart options
General options

All general options are combined in options object.

See the list of available options
viewType String. Type of view to show: "grid" or "charts" or "grid_charts" (starting from v1.9).
configuratorActive Boolean. Indicates whether the Fields List is opened (true) or closed (false). The default value is false.
configuratorButton Boolean. Indicates whether the Fields List toggle button is visible (true) or not (false).
showAggregations Boolean. Indicates whether the aggregation selection control is visible (true) or not (false) for measures on Fields List. Default value is true.
showCalculatedValuesButton Boolean. Controls the visibility of “Add calculated value” in Fields List. Default value is true.
grouping Boolean. Indicates whether grouping is enabled. Default value is false. This feature allows customers to group chosen elements using filter window. For example, the customer has shops in different cities and wants to analyze sales information. It is possible to combine several cities in one group by geography or by the sales numbers, etc. Only for "ocsv", "csv" and "json" data source types.
editing Boolean. Indicates whether the editing feature is enabled (true) or disabled (false) on the Drill Through popup for CSV, OCSV and JSON data sources. User will be able to double-click the cell and enter new value in it if the editing feature is enabled.
drillThrough Boolean. Indicates whether the drill through feature is enabled (true) or disabled (false). User can drill through by double-clicking the cell with value. Drill through feature is available for all data sources except icCube. Default value is true.
showDrillThroughConfigurator Boolean. Indicates whether the Fields List toggle button is visible in Drill Through view. Default value is true.
sorting String. Indicates whether the sorting controls are visible in rows ("rows"), in columns ("columns"), in rows and columns ("on" or true) on the grid cells or not visible ("off" or false). Default value is "on".
datePattern String. It is used to format “date string” date fields ("type":"date string" in JSON, "ds+" prefix in CSV). A default pattern string is dd/MM/yyyy.
dateTimePattern String. It is used to format “datetime” date fields ("type":"datetime" in JSON, "dt+" prefix in CSV). A default pattern string is dd/MM/yyyy HH:mm:ss.
saveAllFormats Boolean. If there are more than 5 formats defined, only the formats that are used for "active=true" measures will be saved in the report. In order to get saved all the formats, no matter how many of them you have and whether they are used for active measures or not, please set saveAllFormats property to true. Default value is false.
showDefaultSlice Boolean. Defines whether the component selects a default slice for the report with empty slice (when nothing is set in rows, columns, report filters and measures). If true, the first hierarchy from data goes to rows and the first measure goes to columns in the default slice. To avoid this default behavior, please set this property to false. Default value is true. Only for "csv", "ocsv" and "json" data source types.
useOlapFormatting Boolean. Indicates whether the values from data source will be formatted according to the format defined in the cube (true) or not (false). Default value is false.
showMemberProperties Boolean. Indicates whether the member properties for OLAP data source are available in the component (true) or not (false). Default value is false. This feature is only for "microsoft analysis services" and "mondrian" data source types.
showEmptyData Boolean. By default, if you have an empty CSV data source but the header is defined the component will show your slice with empty data cells. Set the value as false – the Component will show the “Data source is empty. Please check the CSV file.” message.
defaultHierarchySortName String. Sorting type for hierarchies’ members ("asc", "desc" or "unsorted"). Default value is "asc".
selectEmptyCells Boolean. Indicates whether it is possible to select cells outside of the table. Default value is true.
showOutdatedDataAlert Boolean. Setting a value to true will show the warning to the user before automatic reloading of data from the cube. Default value is false which means there will be no warnings. Only for Flexmonster Accelerator.
showAggregationLabels Boolean. Indicates whether aggregation labels like "Total Sum of", "Sum of", etc. are shown in the columns/rows title. Default value is true.
Check live demo showing options
How to set options
    Options can be set in several ways:
  1. The most convenient way to set options is to specify them in the report. Here is how grid title can be added:
    {
        "dataSource": {
            "filename": "http://www.flexmonster.com/download/data.csv"
        },
        "options": {
            "grid": {
                "title": "Results"
            }
        }
    }
    
    Check out live sample on JSFiddle.
  2. You can change options among with other report parts using API call setReport(). Also options can be changed separately via setOptions(). To see the current options use getOptions().
    For example, see how to set chart title:
    flexmonster.setOptions({
    	chart: {
    		title: "Chart One"
    	}
    });
    flexmonster.refresh();
    
  3. Some options can be changed using Toolbar. Use Options in Toolbar to change grand totals, subtotals and table layout in run time. options
Default options

In case options were not defined in the report, Pivot Component will use global options, if they are defined, or defaults from the component. These options can be overridden in the report.

Example of default options
{
   "dataSource": {
        "filename": "http://www.flexmonster.com/download/data.csv"
    },
    "options": {
        "viewType": "grid",
        "grid": {
            "type": "compact",
            "title": "",
            "showFilter": true,
            "showHeaders": true,
            "fitGridlines": false,
            "showTotals": "on",
            "showGrandTotals": "on",
            "showExtraTotalLabels": false,
            "showHierarchies": true,
            "showHierarchyCaptions": true,
            "showReportFiltersArea": true
        },
        "chart": {
            "type": "bar",
            "title": "",
            "showFilter": true,
            "multipleMeasures": false,
            "oneLevel": false,
            "autoRange": false,
            "reversedAxes": false,
            "showLegendButton": false,
            "showAllLabels": false,
            "showMeasures": true,
            "showOneMeasureSelection": true,
            "showWarning": true,
            "activeMeasure": ""
        },
        "configuratorActive": false,
        "configuratorButton": true,
        "showAggregations": true,
        "showCalculatedValuesButton": true,
        "editing": false,
        "drillThrough": true,
        "showDrillThroughConfigurator": true,
        "sorting": "on",
        "datePattern": "dd/MM/yyyy",
        "dateTimePattern": "dd/MM/yyyy HH:mm:ss",
        "saveAllFormats": false,
        "showDefaultSlice": true,
        "showEmptyData": false,
        "defaultHierarchySortName": "asc",
        "selectEmptyCells": true,
        "showOutdatedDataAlert": false
    }
}
What's next?