Search results

PivotViewComponent

ejs-pivotview represents the VueJS Pivot Table Component.

<ejs-pivotview></ejs-pivotview>

Properties

aggregateTypes

AggregateTypes[]

Allows you to show a menu with built-in aggregate options displayed in the pivot button’s dropdown icon of field list and groupingBar UI. These aggregate options helps to display the values in the pivot table with appropriate aggregations such as sum, product, count, average, etc… easily at runtime. The available aggregate options are:

  • Sum: Allows to display the pivot table values with sum.
  • Product: Allows to display the pivot table values with product.
  • Count: Allows to display the pivot table values with count.
  • DistinctCount: Allows to display the pivot table values with distinct count.
  • Min: Allows to display the pivot table with minimum value.
  • Max: Allows to display the pivot table with maximum value.
  • Avg: Allows to display the pivot table values with average.
  • Median: Allows to display the pivot table values with median.
  • Index: Allows to display the pivot table values with index.
  • PopulationStDev: Allows to display the pivot table values with population standard deviation.
  • SampleStDev: Allows to display the pivot table values with sample standard deviation.
  • PopulationVar: Allows to display the pivot table values with population variance.
  • SampleVar: Allows to display the pivot table values with sample variance.
  • RunningTotals: Allows to display the pivot table values with running totals.
  • DifferenceFrom: Allows to display the pivot table values with difference from the value of the base item in the base field.
  • PercentageOfDifferenceFrom: Allows to display the pivot table values with percentage difference from the value of the base item in the base field.
  • PercentageOfGrandTotal: Allows to display the pivot table values with percentage of grand total of all values.
  • PercentageOfColumnTotal: Allows to display the pivot table values in each column with percentage of total values for the column.
  • PercentageOfRowTotal: Allows to display the pivot table values in each row with percentage of total values for the row.
  • PercentageOfParentTotal: Allows to display the pivot table values with percentage of total of all values based on selected field.
  • PercentageOfParentColumnTotal: Allows to display the pivot table values with percentage of its parent total in each column.
  • PercentageOfParentRowTotal: Allows to display the pivot table values with percentage of its parent total in each row.

    It is applicable only for Relational data.

Defaults to [‘Sum’, ‘Count’, ‘DistinctCount’, ‘Product’, ‘Min’, ‘Max’, ‘Avg’, ‘Median’, ‘Index’, ‘PopulationVar’, ‘SampleVar’,‘PopulationStDev’, ‘SampleStDev’, ‘RunningTotals’, ‘PercentageOfGrandTotal’, ‘PercentageOfColumnTotal’, ‘PercentageOfRowTotal’,‘PercentageOfParentColumnTotal’, ‘PercentageOfParentRowTotal’, ‘DifferenceFrom’, ‘PercentageOfDifferenceFrom’,‘PercentageOfParentTotal’]

allowCalculatedField

boolean

Allows the built-in calculated field dialog to be displayed in the component. You can view the calculated field dialog by clicking the “Calculated Field” button in the field list UI. This dialog will helps you to create a new calculated field in the pivot table, based on available fields from the bound data source or using simple formula with basic arithmetic operators at runtime.

Defaults to false

allowConditionalFormatting

boolean

Allows you to change the appearance of the pivot table value cells with different style properties such as background color, font color, font family, and font size based on specific conditions. You can apply the conditional formatting at runtime through the built-in dialog, invoked from the toolbar. To do so, set allowConditionalFormatting and showToolbar properties to true to the component. Also, include the toolbar option ConditionalFormatting in the toolbar property.

You can also view the conditional formatting dialog by clicking an external button using the showConditionalFormattingDialog method.

Defaults to false

allowDataCompression

boolean

Allows large amounts of data to be loaded without any degradation of performance by compressing raw data on the basis of its uniqueness. These unique records will be provided as input to render the pivot table. For example, if the pivot table is connected to a million raw data with a combination of 1,000 unique data, it will be compressed to 1,000 unique data. By doing so, the time taken to render the pivot table will be drastically reduced, i.e. the pivot table will takes a maximum of 3 seconds instead of 10 seconds to complete its rendering. These compressed data will also be used for further operations at all times to reduce the looping complexity and improves pivot table’s performance while updating during runtime.

To use this option, it requires the property enableVirtualization to be true.

This property is applicable only for relational data source.

Defaults to false

allowDeferLayoutUpdate

boolean

Allows the pivot table component to be updated only on demand, meaning, you can perform a variety of operations such as drag-and-drop fields between row, column, value and filter axes, apply sorting and filtering inside the Field List, resulting the field list UI would be updated on its own, but not the pivot table. On clicking the “Apply” button in the Field List, the pivot table will updates the last modified report. This helps to improve the performance of the pivot table component rendering.

Defaults to false

allowDrillThrough

boolean

Allows to view the underlying raw data of a summarized cell in the pivot table. By double-clicking on any value cell, you can view the detailed raw data in a data grid inside a new window. In the new window, row header, column header and measure name of the clicked cell will be shown at the top. You can also include or exclude fields available in the data grid using column chooser option.

Defaults to false

allowExcelExport

boolean

Allows the pivot table data to be exported as an Excel document. Export can be done in two different file formats such as XLSX and CSV formats. You can export pivot table using the build-in toolbar option. To do so, set allowExcelExport and showToolbar properties to true to the component. Also, include the toolbar option Exporting in the toolbar property.

You can also export the pivot table data by clicking an external button using the excelExport method. Use csvExport method to export the pivot table data to CSV format.

Defaults to false

allowGrouping

boolean

Allows you to show the grouping UI in the pivot table that automatically groups date, time, number and string at runtime. by right clicking on the pivot table’s row or column header, select Group. This will shows a dialog in which you can perform grouping with appropriate options to group the data. To ungroup, right click on the pivot table’s row or column header, select Ungroup.

This property is applicable only for relational data source.

Defaults to false

allowNumberFormatting

boolean

Allows you to apply required number formatting to the pivot table values such as number, currency, percentage or other custom formats at runtime through a built-in dialog, invoked from the toolbar. To do so, set allowNumberFormatting and showToolbar properties to true to the component. Also, include the toolbar option NumberFormatting in the toolbar property.

You can also view the number formatting dialog by clicking an external button using the showNumberFormattingDialog method.

Defaults to false

allowPdfExport

boolean

Allows the pivot table data to be exported as an PDF document. You can export pivot table using the build-in toolbar option. To do so, set allowPdfExport and showToolbar properties to true to the component. Also, include the toolbar option Exporting in the toolbar property.

You can also export the pivot table data by clicking an external button using the pdfExport method.

Defaults to false

cellTemplate

string | Function

Allows the table cell elements to be customized with either an HTML string or the element’s ID, that can be used to add additional HTML elements with custom formats to the cell elements that are displayed in the pivot table.

Defaults to null

chartSettings

ChartSettingsModel

Allows a set of options to customize a pivot chart with a variety of settings, such as chart series, chart area, axis labels, legends, border, crosshairs, theme, title, tooltip, zooming, etc. The following options are available to customize the pivot chart.

  • background: Allows you to change the background color of the chart series in the pivot chart. For example, to display the chart series with background color as red, set the property background to either “red” or “#FF0000” or “rgba(255,0,0,1.0)”.
  • border: Allow options to customize the border of the chart series such as color and border size in the pivot chart. For example, to display the chart series border color as red, set the properties color to either “red” or “#FF0000” or “rgba(255,0,0,1.0)” and width to 0.5.
  • chartArea: Allow options to customize the chart area with a variety of settings such as background color, border, opacity and background image in the pivot chart. For example, to change the of the pivot chart’s background, set the property opacity to 0.5.
  • chartSeries: Allow options to customize the chart series with different settings such as fill color, animation of the series, series width, border, visibility of the series, opacity, chart series types, marker, tooltip, trendlines, etc., in the pivot chart. For example, to display the line type pivot chart, set the property type to Line.
  • crosshair: Allow options to customize the crosshair line with different settings such as color and width of the line, line types that are shown horizontally and vertically to indicate the value of the axis at the mouse hover or touch position in the pivot chart.
  • description: Allows you to add a description of the pivot chart.
  • enableAnimation: Allows you to enable/disable the tooltip animation while performing the mouse move from one point to another in the pivot chart.
  • enableCanvas: Allows you to render the pivot chart in canvas mode.
  • enableExport: Allows the pivot chart to be exported to either PDF or PNG or JPEG or SVG filter formats.
  • enableMultipleAxis: Allows you to draw the pivot chart with multiple value fields as separate chart area.
  • enableSideBySidePlacement: Allows you to draw points of the column type pivot chart series as side by side.
  • isMultiSelect: Allows you to perform multiple selection in the pivot chart. To enable this option, it requires the property selectionMode to be Point or Series or Cluster.
  • isTransposed: Allows you to render the pivot chart in a transposed manner or not.
  • legendSettings: Allow options for customizing legends with different properties such as legend visibility, height, width, position, legend padding, alignment, textStyle, border, margin, background, opacity, description, tabIndex in the pivot chart.
  • margin: Allow options to customize the left, right, top and bottom margins of the pivot chart.
  • palettes: Allows you to draw the chart series points with custom color in the pivot chart.
  • primaryXAxis: Allow options to customize the horizontal(row) axis with different properties such as labelIntersectAction, labelStyle, title, description, crosshairTooltip, labelFormat, titleStyle, plotOffset, edgeLabelPlacement, labelPlacement, tickPosition, opposedPosition, minor and major grid lines, minor and major tick lines, border, etc. in the pivot chart.
  • primaryYAxis: Allow options to customize the vertical(value) axis with different properties such as labelIntersectAction, labelStyle, title, description, crosshairTooltip, labelFormat, titleStyle, plotOffset, edgeLabelPlacement, labelPlacement, tickPosition, opposedPosition, minor and major grid lines, minor and major tick lines, border, etc. in the pivot chart.
  • selectedDataIndexes: Allows you to highlight a specific point of the series while rendering the pivot chart. For example, to highlight first point in the first series, set the properties series to 0 and points to 1. To use this option, it requires the property selectionMode to be Point or Series.
  • selectionMode: Allow options for customizing the selection mode to be done either by a specific series or point or cluster or by dragging it to the pivot chart. For example, to highlight a specific point in a specific series of the pivot chart, set the property selectionMode to Point.
  • showMultiLevelLabels: Allows you to display the multi-level label feature in the pivot chart. This multi-level labels used to perform drill operation in the pivot chart.
  • subTitle: Allows you to add the subtitle to the pivot chart.
  • subTitleStyle: Allow options to customize the subtitle in the pivot chart with different properties such as fontStyle, font size, fontWeight, font color, testAlignment, fontFamily, opacity, textOverflow.
  • tabIndex: Allows you to highlight specific legends by clicking the mouse or by interacting with the keyboard in the pivot chart.
  • theme: Allows you to draw a pivot chart with either material, fabric, bootstrap, highcontrast light, material dark, fabric dark, highcontrast, bootstrap dark, bootstrap4 theme.
  • title: Allows you to add title to the pivot chart.
  • titleStyle: Allow options to customize the title in the pivot chart with different properties such as fontStyle, font size, fontWeight, font color, testAlignment, fontFamily, opacity, textOverflow.
  • tooltip: Allow options to customize the tooltip of the pivot chart with different properties such as visibility of the tooltip, enableMarker, fill color, opacity, header for tooltip, format, textStyle, template, border, enableAnimation.
  • useGroupingSeparator: Allows the group separator to be shown to the values in the pivot chart.
  • value: Allows you to draw a pivot chart with a specific value field during initial loading.
  • zoomSettings: Allow options to customize the pivot chart zooming with different properties such as enablePinchZooming, enableSelectionZooming, enableDeferredZooming, enableMouseWheelZooming, zoom modes, toolbarItems, enableScrollbar and enablePan.

chartTypes

ChartSeriesType[]

Allows you to display the pivot chart with specific chart types from built-in chart options, invoked from the toolbar. The available chart types are:

  • Line: Allows to display the pivot chart with line series.
  • Column: Allows to display the pivot chart with column series.
  • Area: Allows to display the pivot chart with area series.
  • Bar: Allows to display the pivot chart with bar series.
  • StackingColumn: Allows to display the pivot chart with stacked column series.
  • StackingArea: Allows to display the pivot chart with stacked area series.
  • StackingBar: Allows to display the pivot chart with stacked bar series.
  • StackingLine: Allows to display the pivot chart with stacked line series.
  • StepLine: Allows to display the pivot chart with step line series.
  • StepArea: Allows to display the pivot chart with step area series.
  • SplineArea: Allows to display the pivot chart with spline area series.
  • Scatter: Allows to display the pivot chart with scatter series.
  • Spline: Allows to display the pivot chart with spline series.
  • StackingColumn100: Allows to display the pivot chart with 100% stacked column series.
  • StackingBar100: Allows to display the pivot chart with 100% stacked bar series.
  • StackingArea100: Allows to display the pivot chart with 100% stacked area series.
  • StackingLine100: Allows to display the pivot chart with 100% stacked line series.
  • Bubble: Allows to display the pivot chart with bubble series.
  • Pareto: Allows to display the pivot chart with pareto series.
  • Polar: Allows to display the pivot chart with polar series.
  • Radar: Allows to display the pivot chart with radar series.
  • Pie: Allows to display the pivot chart with pie series.
  • Doughnut: Allows to display the pivot chart with doughnut series.
  • Funnel: Allows to display the pivot chart with funnel series.
  • Pyramid: Allows to display the pivot chart with pyramid series. To use this option, the showToolbar property must be true along with toolbar option Chart to be set to the toolbar property.

Defaults to [‘Line’, ‘Column’, ‘Area’, ‘Bar’, ‘StackingColumn’, ‘StackingArea’, ‘StackingBar’, ‘StepLine’, ‘StepArea’,‘SplineArea’,‘StackingLine’, ‘Scatter’, ‘Spline’, ‘StackingColumn100’, ‘StackingBar100’, ‘StackingArea100’, ‘StackingLine100’, ‘Bubble’, ‘Pareto’, ‘Polar’,‘Radar’, ‘Pie’, ‘Doughnut’, ‘Funnel’, ‘Pyramid’ ]

cssClass

string

Allows you to add the CSS class name to the pivot table element. Use this class name, you can customize the pivot table and its inner elements easily at your end.

Defaults to

dataSourceSettings

DataSourceSettingsModel

Allows the following pivot report information such as rows, columns, values, filters, etc., that are used to render the pivot table and field list.

  • catalog: Allows to set the database name of SSAS cube as string type that used to retrieve the data from the specified connection string. Note: It is applicable only for OLAP data source.
  • cube: Allows you to set the SSAS cube name as string type that used to retrieve data for pivot table rendering. Note: It is applicable only for OLAP data source.
  • providerType: Allows to set the provider type to identify the given connection is either Relational or SSAS to render the pivot table and field list.
  • url: Allows to set the URL as string type, which helps to identify the service endpoint where the data are processed and retrieved to render the pivot table and field list. Note: It is applicable only for OLAP data source.
  • localeIdentifier: Allows you to set the specific culture code as number type to render pivot table with desired localization. By default, the pivot table displays with culture code 1033, which indicates “en-US” locale. Note: It is applicable only for OLAP data source.
  • dataSource: Allows you to set the data source as JSON collection to the pivot report either from local or from remote server to the render the pivot that and field list. You can fetch JSON data from remote server by using DataManager. Note: It is applicable only for relational data source.
  • rows: Allows specific fields associated with field information that needs to be displayed in row axis of pivot table.
  • columns: Allows specific fields associated with field information that needs to be displayed in column axis of pivot table.
  • values: Allows specific fields associated with field information that needs to be displayed as aggregated numeric values in pivot table.
  • filters: Allows to filter the values in other axis based on the collection of filter fields in pivot table.
  • excludeFields: Allows you to restrict the specific field(s) from displaying it in the field list UI. You may also be unable to render the pivot table with this field(s) by doing so. Note: It is applicable only for relational data source.
  • expandAll: Allows you to either expand or collapse all the headers that are displayed in the pivot table. By default, all the headers are collapsed in the pivot table. Note: It is applicable only for Relational data.
  • valueAxis: Allows you to set the value fields that to be plotted either in row or column axis in the pivot table.
  • filterSettings: Allows specific fields associated with either selective or conditional-based filter members that used to be displayed in the pivot table.
  • sortSettings: Allows specific fields associated with sort settings to order their members either in ascending or descending that used to be displayed in the pivot table. By default, the data source containing fields are display with Ascending order alone. To use this option, it requires the enableSorting property to be true.
  • enableSorting: Allows to perform sort operation to order members of a specific fields either in ascending or descending that used to be displayed in the pivot table.
  • formatSettings: Allows specific fields used to display the values with specific format that used to be displayed in the pivot table. For example, to display a specific field with currency formatted values in the pivot table, the set the format property to be C.
  • drilledMembers: Allows specific fields used to display their the headers to be either expanded or collapsed in the pivot table.
  • valueSortSettings: Allows to sort individual value field and its aggregated values either in row or column axis to ascending or descending order.
  • calculatedFieldSettings: Allows to create new calculated fields from the bound data source or using simple formula with basic arithmetic operators in the pivot table.
  • allowMemberFilter: Allows to perform filter operation based on the selective filter members of the specific fields used to be displayed in the pivot table.
  • allowLabelFilter: Allows to perform filter operation based on the selective headers used to be displayed in the pivot table.
  • allowValueFilter: Allows to perform filter operation based only on value fields and its resultant aggregated values over other fields defined in row and column axes that used to be displayed in the pivot table.
  • showSubTotals: Allows to show or hide sub-totals in both rows and columns axis of the pivot table.
  • showRowSubTotals: Allows to show or hide sub-totals in row axis of the pivot table.
  • showColumnSubTotals: Allows to show or hide sub-totals in column axis of the pivot table.
  • showGrandTotals: Allows to show or hide grand totals in both rows and columns axis of the pivot table.
  • showRowGrandTotals: Allows to show or hide grand totals in row axis of the pivot table.
  • showColumnGrandTotals: Allows to show or hide grand totals in column axis of the pivot table.
  • showHeaderWhenEmpty: Allows the undefined headers to be displayed in the pivot table, when the specific field(s) are not defined in the raw data. For example, if the raw data for the field ‘Country’ is defined as “United Kingdom” and “State” is not defined means, it will be shown as “United Kingdom >> Undefined” in the header section.
  • alwaysShowValueHeader: Allows to show the value field header always in pivot table, even if it holds a single field in the value field axis.
  • conditionalFormatSettings: Allows a collection of values fields to change the appearance of the pivot table value cells with different style properties such as background color, font color, font family, and font size based on specific conditions.
  • emptyCellsTextContent: Allows to show custom string to the empty value cells that used to display in the pivot table. You can fill empty value cells with any value like “0”, ”-”, ”*”, “(blank)”, etc.
  • groupSettings: Allows specific fields to group their data on the basis of their type. For example, the date type fields can be formatted and displayed based on year, quarter, month, and more. Likewise, the number type fields can be grouped range-wise, such as 1-5, 6-10, etc. You can perform custom group to the string type fields that used to displayed in the pivot table.
  • showAggregationOnValueField: Allows the pivot button with specific value field caption along with the aggregation type, to be displayed in the grouping bar and field list UI. For example, if the value field “Sold Amount” is aggregated with Sum, it will be displayed with caption “Sum of Sold Amount” in its pivot button.
  • authentication: Allows you to set the credential information to access the specified SSAS cube. Note: It is applicable only for OLAP data source.

displayOption

DisplayOptionModel

Allow options to configure the view port as either pivot table or pivot chart or both table and chart. The options available are:

  • view: Allows you to choose the view port as either pivot table or pivot chart or both table and chart.
  • primary: Allows you to set the primary view to be either pivot table or pivot chart. To use this option, it requires the property view to be Both.

editSettings

CellEditSettingsModel

Allow options for performing CRUD operations, such as add, edit, delete, and update the raw items of any cell from the pivot table. The raw items can be viewed in a data grid that used to be displayed as a dialog by double-clicking the appropriate value cell in the pivot table. CRUD operations can be performed in this data grid either by double-clicking the cells or using toolbar options. The options available are as follows:

  • allowAdding: Allows you to add a new record to the data grid used to update the appropriate cells in the pivot table.
  • allowEditing: Allows you to edit the existing record in the data grid that used to update the appropriate cells in the pivot table.
  • allowDeleting: Allows you to delete the existing record from the data grid that used to update the appropriate cells in the pivot table.
  • allowCommandColumns: Allows an additional column appended in the data grid layout holds the command buttons to perform the CRUD operations to edit, delete, and update the raw items to the data grid that used to update the appropriate cells in the pivot table.
  • mode: Allow options for performing CRUD operations with different modes in the data grid that used to update the appropriate cells in the pivot table. The available modes are normal, batch and dialog. Normal mode is enabled for CRUD operations in the data grid by default.
  • allowEditOnDblClick: Allows you to restrict CRUD operations by double-clicking the appropriate value cell in the pivot table.
  • showConfirmDialog: Allows you to show the confirmation dialog to save and discard CRUD operations performed in the data grid that used to update the appropriate cells in the pivot table.
  • showDeleteConfirmDialog: Allows you to show the confirmation dialog to delete any records from the data grid.
  • allowInlineEditing: Allows direct editing of a value cell without opening the edit dialog. NOTE: It is applicable only if the value cell is made by a single raw data. Otherwise editing dialog will be shown.

    This feature is applicable only for the relational data source.

Defaults to { allowAdding: false, allowEditing: false, allowDeleting: false, allowCommandColumns: false,mode:‘Normal’, allowEditOnDblClick: true, showConfirmDialog: true, showDeleteConfirmDialog: false, allowInlineEditing: false }

enableFieldSearching

boolean

It enables the search option in the field list UI, which can be used to search specific fields at runtime.

This option is only available when the pivot table’s built-in popup field list is enabled using the showFieldList property.

Defaults to false

enableHtmlSanitizer

boolean

Allows to restrict the cross-site scripting while using cell template, meaning it will remove the unwanted scripts,styles or HTML in your cell template.

In general, the cross-site scripting known as XSS is a type of computer security vulnerability typically found in web applications. It attacks enable attackers to inject client-side scripts into web pages viewed by other users.

Defaults to false

enablePaging

boolean

Allows large amounts of data to be displayed page-by-page. It helps to display the rows and columns by configuring the page size and current page using pageSettings option in the pivot table.

Defaults to false

enablePersistence

boolean

Enable or disable persisting component’s state between page reloads.

Defaults to false

enableRtl

boolean

Enable or disable rendering component in right to left direction.

Defaults to false

enableValueSorting

boolean

Allows you to sort individual value field and its aggregated values either in row or column axis to ascending or descending order. You can sort the values by clicking directly on the value field header positioned either in row or column axis of the pivot table.

Defaults to false

enableVirtualization

boolean

Allows to load the large amounts of data without any performance degradation by rendering rows and columns only in the current content view port. Rest of the aggregated data will be brought into view port dynamically based on vertical or horizontal scroll position.

Defaults to false

exportAllPages

boolean

Allows you to export the pivot table data of all pages, i.e. the data that holds all the records given to render the pivot table will be exported as either an Excel or a PDF document. To use this option, it requires the property enableVirtualization to be true.

Defaults to true

gridSettings

GridSettingsModel

Allows the set of options to customize rows, columns, values cell and its content in the pivot table. The following options to customize the pivot table are:

  • height: Allow the height of the pivot table content to be set, meaning that the height given should be applied without considering the column headers in the pivot table.
  • width: Allow to set width of the pivot table. Note: The pivot table will not display less than 400px, as it is the minimum width to the component.
  • gridLines: Allow the options for customizing the cell borders of each cell to be displayed in the pivot table. For example, to display a pivot table without cell borders, set the property gridLines to None.
  • allowTextWrap: Allow the contents of the cells to be wrapped when they exceed the width of the cells in the pivot table.
  • textWrapSettings: Allows options to wrap either column and row header or value or both header and cell content. For example, to allow the wrap option to value cells alone, then set the property wrapMode to Content in the textWrapSettings class.
  • allowReordering: Allows to reorder a specific column header from one index to another index in the pivot table by drag-and-drop.
  • allowResizing: Allows the columns to be resized by clicking and dragging the right edge of the column headers.
  • rowHeight: Allow to set height to the pivot table rows commonly.
  • columnWidth: Allow to set width to the pivot table columns commonly.
  • clipMode: Allows the contents of the cell overflow to be displayed in the pivot table. For example, to truncate the cell content of a cell when it overflows with respect to its cell width, set the property clipMode to Clip.
  • allowSelection: Allows a row or column or cell to be highlighted by simply clicking or arrow key in the pivot table.
  • selectionSettings: Allow set of options to customize the selection of a row or column or cell by simply clicking on the arrow key in the pivot table. For example, to highlight both rows and columns with multiple selection, set the properties mode to Both and type to Multiple in selectionSettings class.
  • selectedRowIndex: Allows to highlight specific row in the pivot table during initial rendering. For example, to highlight the pivot table’s first row, set the property selectedRowIndex to 0.
  • contextMenuItems: Allows to show built-in context with pre-defined menu option or custom menu options by simply right clicking on the pivot table cell.

groupingBarSettings

GroupingBarSettingsModel

Allows a set of options for customizing the grouping bar UI with a variety of settings such as UI visibility to a specific view port, customizing the pivot button features such as filtering, sorting, changing aggregate types, removing any fields. The options available to customize the grouping bar UI are:

  • showFilterIcon: Allows you to show or hide the filter icon that used to be displayed on the pivot button of the grouping bar UI. This filter icon is used to filter the members of a particular field at runtime in the pivot table.
  • showSortIcon: Allows you to show or hide the sort icon that used to be displayed in the pivot button of the grouping bar UI. This sort icon is used to order members of a particular fields either in ascending or descending at runtime.
  • showRemoveIcon: Allows you to show or hide the remove icon that used to be displayed in the pivot button of the grouping bar UI. This remove icon is used to remove any field during runtime.
  • showValueTypeIcon: Allows you to show or hide the value type icon that used to be displayed in the pivot button of the grouping bar UI. This value type icon helps to select the appropriate aggregation type to value fields at runtime.
  • displayMode: Allow options to show the grouping bar UI to specific view port such as either pivot table or pivot chart or both table and chart. For example, to show the grouping bar UI to pivot table on its own, set the property displayMode to Table.
  • allowDragAndDrop: Allows you to restrict the pivot buttons that were used to drag on runtime in the grouping bar UI. This will prevent you from modifying the current report.

height

string | number

Allow the height of the pivot table to be set.

Defaults to ‘auto’

hyperlinkSettings

HyperlinkSettingsModel

Allow a set of options to display a hyperlink to link data for individual cells that are shown in the pivot table. These options allow you to enable a separate hyperlink for row headers, column headers, value cells, and summary cells in the hyperlinkSettings class. The options available are:

  • showHyperlink: Allows you to set the visibility of hyperlink in all cells.
  • showRowHeaderHyperlink: Allows you to set the visibility of hyperlink in row headers.
  • showColumnHeaderHyperlink: Allows you to set the visibility of hyperlink in column headers.
  • showValueCellHyperlink: Allows you to set the visibility of hyperlink in value cells.
  • showSummaryCellHyperlink: Allows you to set the visibility of hyperlink in summary cells.
  • headerText: Allows you to set the visibility of hyperlink based on header text.
  • conditionalSettings: Allows you to set the visibility of hyperlink based on specific condition.
  • cssClass: Allows you to add CSS class name to the hyperlink options.

    By default, the hyperlink options are disabled for all cells in the pivot table.

loadOnDemandInMemberEditor

boolean

Allows to load members inside the member filter dialog on-demand. The first level members will be loaded from the OLAP cube to display the member editor by default. As a result, the member editor will be opened quickly, without any performance constraints. You can use either of the following actions to load your next level members. The actions are:

  • By clicking on the respective member’s expander button. By doing so, only the child members of the respective member will be loaded.
  • Choose the level from the drop-down button. By doing so, all the members up to the level chosen will be loaded from the cube. Also, searching members will only be considered for the level members that are loaded.

    This property is applicable only for OLAP data source.

Defaults to true

locale

string

Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.

Defaults to

maxNodeLimitInMemberEditor

number

Allows you to set the limit for displaying members while loading large data in the member filter dialog. Based on this limit, initial loading will be completed quickly without any performance constraint. A message with remaining member count, that are not currently shown in the member filter dialog UI, will be displayed in the member editor.

This property is not applicable to user-defined hierarchies in the OLAP data source.

Defaults to 1000

maxRowsInDrillThrough

number

Allows you to set the maximum number of raw data that used to view it in a data grid inside a new window while performing drill through on summarized cells in the pivot table. For example, if the value cell has a combination of more than 50,000 records, it allows only 10,000 records fetch from the cube and displayed in the data grid.

This property is applicable only for the OLAP data source.

Defaults to 10000

pageSettings

PageSettingsModel

Allows to set the page information to display the pivot table with specific page during paging and virtual scrolling.

pagerSettings

PagerSettingsModel

Allows a set of options for customizing the paging UI with a variety of settings such as UI position, template and visibility to a specific axis info such as page size, paging data.

To use this option, it requires the property enablePaging to be true.

pivotValues

IAxisSet[][]

It holds the collection of cell information that has been populated from the engine on the basis of the given pivot report to render the component as table and chart.

showFieldList

boolean

Allows built-in popup field list to be enabled in the pivot table UI. The popup field list will be displayed over the pivot table UI without affecting any form of UI shrink, and allows to manipulate the pivot report through different ways such as add or remove fields and also rearrange them between different axes, including column, row, value, and filter along with sort and filter options dynamically at runtime to update the pivot table.

By default, the icon used to display the field list will be positioned at the top left corner of the pivot table UI. When groupingBar is enabled, the icon will be placed at the top right corner of the pivot table.

Defaults to false

showGroupingBar

boolean

Allows you to show the grouping bar UI in the pivot table that automatically populates fields from the bound report. It also allows you to modify the report with a variety of actions using the pivot buttons to update the pivot table during runtime. The following are:

  • Re-arranging fields through drag-and-drop operation between row, column, value and filter axes.
  • Remove fields from the existing report using remove icon.
  • Filtering members of specific fields using filter icon.
  • Sorting members of specific fields using sort icon.
  • Editing the calculated fields using edit icon.
  • Selecting required aggregate types to value field using dropdown icon.

Defaults to false

showToolbar

boolean

Allows you to show the toolbar UI that holds built-in toolbar options to accessing frequently used features like switching between pivot table and pivot chart, changing chart types, conditional formatting, number formatting, exporting, etc… with ease at runtime.

Defaults to false

showTooltip

boolean

Allows you to display the tooltip to the value cells either by mouse hovering or by touch in the pivot table. The information used to be displayed in the tooltip is:

  • Row: Holds the row header information of a specific value cell.
  • Column: Holds the column header information of a specific value cell.
  • Value: Holds the value field caption along with its value of a specific value cell.

Defaults to true

showValuesButton

boolean

Allows you to create a pivot button with “Values” as a caption used to display in the grouping bar and field list UI. It helps you to plot the value fields to either column or row axis during runtime.

The showValuesButton property is enabled by default for the OLAP data source. And the pivot button can be displayed with “Measures” as a caption used to display in the grouping bar and field list UI.

Defaults to false

spinnerTemplate

string | Function

Allows the appearance of the loading indicator to be customized with either an HTML string or the element’s ID, that can be used to displayed with custom formats in the pivot table.

Defaults to null

toolbar

ToolbarItems[] | ItemModel[]

Allows the built-in toolbar options that used to access features like switching between pivot table and pivot chart, changing chart types, conditional formatting, number formatting, exporting, etc… with ease at runtime. The available toolbar options are:

  • New: Allows to create a new report.
  • Save: Allows to save the current report.
  • Save As: Allows to perform save as the current report.
  • Rename: Allows to rename the current report.
  • Remove: Allows to delete the current report.
  • Load: Allows to load any report from the report list.
  • Grid: Allows to show the pivot table.
  • Chart: Allows to show the pivot chart with specific type from the built-in list. It also has the option to show the chart with multiple axes based on the value fields bound to the report. You can do this by selecting the checkbox at the bottom of the list.
  • Exporting: Allow set of options to export the pivot table as PDF/Excel/CSV and the pivot chart as PDF and image format such as PNG, JPEG, SVG.
  • Sub-total: Allow set of options to show or hide the sub totals in the pivot table. The subtotals will not be displayed in the pivot chart by default.
  • Grand Total: Allow set of options to show or hides the grand totals in the pivot table. By default, the grand totals will not be displayed in the pivot chart.
  • Conditional Formatting: Allows to show the conditional formatting pop-up to apply formatting to the values.
  • Number Formatting: Allows to show the number formatting pop-up to apply number formatting to the values.
  • Formatting: Allow options to show the conditional formatting and the number formatting pop-up that used to apply formatting to the values in the component.
  • Field List: Allows you to show the field list pop-up. It allows you to modify the report with a variety of actions such as re-arrange the fields between axes by drag-and-drop, add new fields to report, remove any fields from report, filtering and sorting a specific field members, etc., that are used to update the pivot table during runtime.
  • MDX: Allows ro show the MDX query that was run to retrieve data from the OLAP data source. Note: It is applicable only for OLAP data source.

    The toolbar option can be displayed based on the order you provided in the toolbar collection.

Defaults to null

toolbarTemplate

string | Function

It allows to define the “ID” of div which is used as template in toolbar panel.

Defaults to null

tooltipTemplate

string | Function

Allows the tooltip element to be customized with either an HTML string or the element’s ID, can be used to displayed with custom formats either by mouse hovering or by touch in the pivot table.

Defaults to null

virtualScrollSettings

VirtualScrollSettingsModel

Allow options for customizing the virtual scrolling experience in the pivot table.

This feature is applicable only for the relational data source.

width

string | number

Allow the width of the pivot table to be set.

The pivot table will not display less than 400px, as it is the minimum width to the component.

Defaults to ‘auto’

Methods

chartExport

Method allow to export the pivot chart as PDF and image formats like PNG, JPEG, and SVG.

Parameter Type Description
type ExportType Defines the export type.
pdfExportProperties (optional) PdfExportProperties Allows to define the export properties for the chart.
isMultipleExport (optional) boolean Allows to export multiple tables and charts into a single PDF document.
pdfDoc (optional) Object Allows the export of an external PDF document along with current PDF document.
isBlob (optional) boolean Allows the PDF document to be saved as blob data.

Returns Promise

createCalculatedFieldDialog

Method to open calculated field dialog.

Returns void

csvExport

Export the Pivot table data to a CSV file (.csv).

Parameter Type Description
excelExportProperties (optional) ExcelExportProperties Defines the export properties for customizing the table, such as custom columns, data source, and theme.
isMultipleExport (optional) boolean Specifies whether multiple exports are enabled.
workbook (optional) any Defines the Workbook if multiple exports are enabled.
isBlob (optional) boolean If set to true, the export will be returned as blob data.
isServerExport (optional) boolean Specifies whether server-side CSV export is enabled.

Returns void

destroy

To destroy the PivotView elements.

Returns void

excelExport

Export the Pivot table data to an Excel file (.xlsx).

Parameter Type Description
excelExportProperties (optional) ExcelExportProperties Defines the export properties for customizing the table, such as custom columns, data source, and theme.
isMultipleExport (optional) boolean Specifies whether multiple exports are enabled.
workbook (optional) any Defines the Workbook if multiple exports are enabled.
isBlob (optional) boolean If set to true, the exported file will be returned as blob data.
isServerExport (optional) boolean Specifies whether server-side Excel export is enabled.

Returns void

getPersistData

Get the Pivot widget properties to be maintained in the persisted state.

Returns string

loadPersistData

Loads pivot Layout

Parameter Type Description
persistData string Specifies the persist data to be loaded to pivot.

Returns void

pdfExport

Method allow to export both pivot table and pivot chart in a same PDF document.

Parameter Type Description
pdfExportProperties (optional) PdfExportProperties Allows to define the export properties for the table and chart.
isMultipleExport (optional) boolean Allows to export multiple tables and charts into a single PDF document.
pdfDoc (optional) Object Allows the export of an external PDF document along with current PDF document.
isBlob (optional) boolean Allows the PDF document to be saved as blob data.
exportBothTableAndChart (optional) boolean When the view property inside the displayOption is set to Both, both table and chart data can be exported into a single PDF document.

Returns Promise

printChart

Print method for the chart.

Returns void

refresh

Refreshes the Pivot Table for blazor layoutRefresh is called for other base refresh is called.

Returns void

showConditionalFormattingDialog

Method to open conditional formatting dialog.

Returns void

showNumberFormattingDialog

Method to open the number formatting dialog to set the format dynamically.

Returns void

Events

actionBegin

EmitType<PivotActionBeginEventArgs>

It triggers when UI action begins in the Pivot Table. The UI actions used to trigger this event such as drill down/up, value sorting, built-in toolbar options, grouping bar and field list buttons actions such as sorting, filtering, editing, aggregate type change and so on, CRUD operation in editing.

actionComplete

EmitType<PivotActionCompleteEventArgs>

It triggers when UI action in the Pivot Table completed. The UI actions used to trigger this event such as drill down/up, value sorting, built-in toolbar options, grouping bar and field list buttons actions such as sorting, filtering, editing, aggregate type change and so on, CRUD operation in editing.

actionFailure

EmitType<PivotActionFailureEventArgs>

It triggers when UI action failed to achieve the desired results in the Pivot Table. The UI actions used to trigger this event such as drill down/up, value sorting, built-in toolbar options, grouping bar and field list buttons actions such as sorting, filtering, editing, aggregate type change and so on, CRUD operation in editing.

afterServiceInvoke

EmitType<AfterServiceInvokeEventArgs>

It triggers after the response is returned from the service.

aggregateCellInfo

EmitType<AggregateEventArgs>

It allows to change the each cell value during engine populating.

aggregateMenuOpen

EmitType<AggregateMenuOpenEventArgs>

It triggers before aggregate type context menu opens.

beforeExport

EmitType<BeforeExportEventArgs>

It allows to set properties for exporting.

beforeServiceInvoke

EmitType<BeforeServiceInvokeEventArgs>

It triggers before service get invoked from client.

beginDrillThrough

EmitType<BeginDrillThroughEventArgs>

It triggers when a value cell is clicked in the pivot table for Editing.

calculatedFieldCreate

EmitType<CalculatedFieldCreateEventArgs>

It triggers before a calculated field created/edited during runtime.

cellClick

EmitType<CellClickEventArgs>

It triggers when a cell is clicked in the pivot table.

cellSelected

EmitType<PivotCellSelectedEventArgs>

It triggers when a cell got selected in the pivot table.

cellSelecting

EmitType<PivotCellSelectedEventArgs>

It triggers before a cell selected in pivot table.

chartSeriesCreated

EmitType<ChartSeriesCreatedEventArgs>

It triggers when the pivot chart series are created.

conditionalFormatting

EmitType<IConditionalFormatSettings>

It allows to do changes before applying the conditional formatting.

created

EmitType<Object>

It triggers when the pivot table component is created.

dataBound

EmitType<Object>

It triggers when the pivot table rendered.

destroyed

EmitType<Object>

It triggers when pivot table component getting destroyed.

drill

EmitType<DrillArgs>

It triggers before the header to be either expanded or collapsed in the pivot table.

drillThrough

EmitType<DrillThroughEventArgs>

It triggers when a value cell is clicked in the pivot table for Drill-Through.

editCompleted

EmitType<EditCompletedEventArgs>

It triggers when editing is made in the raw data of pivot table.

enginePopulated

EmitType<EnginePopulatedEventArgs>

It triggers after the pivot engine populated and allows to customize the pivot datasource settings.

enginePopulating

EmitType<EnginePopulatingEventArgs>

It triggers before the pivot engine starts to populate and allows to customize the pivot datasource settings.

exportComplete

EmitType<ExportCompleteEventArgs>

It triggers when exporting to PDF, Excel, or CSV is complete

fetchReport

EmitType<FetchReportArgs>

It allows you to fetch the report names from specified storage.

fieldDragStart

EmitType<FieldDragStartEventArgs>

It triggers when a field drag (move) starts.

fieldDrop

EmitType<FieldDropEventArgs>

It triggers before a field drops into any axis.

fieldListRefreshed

EmitType<FieldListRefreshedEventArgs>

It allows to identify whether the field list updated or not.

fieldRemove

EmitType<FieldRemoveEventArgs>

It triggers before removing the field from any axis during runtime.

hyperlinkCellClick

EmitType<HyperCellClickEventArgs>

It triggers when a hyperlink cell is clicked in the pivot table.

load

EmitType<LoadEventArgs>

It allows any customization on the pivot table component properties on initial rendering. Based on the changes, pivot table will be rendered.

loadReport

EmitType<LoadReportArgs>

It allows to load the report from specified storage.

memberEditorOpen

EmitType<MemberEditorOpenEventArgs>

It triggers before member editor dialog opens.

memberFiltering

EmitType<MemberFilteringEventArgs>

It triggers before the filtering applied.

newReport

EmitType<NewReportArgs>

It allows to set the new report.

numberFormatting

EmitType<NumberFormattingEventArgs>

It triggers before number format is applied to specific field during runtime.

onFieldDropped

EmitType<FieldDroppedEventArgs>

It triggers after a field dropped into the axis.

onHeadersSort

EmitType<HeadersSortEventArgs>

It triggers before the sorting performed.

onPdfCellRender

EmitType<PdfCellRenderArgs>

It allows any customization of Pivot cell style while PDF exporting.

removeReport

EmitType<RemoveReportArgs>

It allows you to remove the current report from the specified storage.

renameReport

EmitType<RenameReportArgs>

It allows you to rename the current report.

saveReport

EmitType<SaveReportArgs>

It allows you to save the report to the specified storage.

toolbarClick

EmitType<ClickEventArgs>

It allows to change the toolbar items.

toolbarRender

EmitType<ToolbarArgs>

It allows to change the toolbar items.

Contents
Contents