Vue PivotGrid - Overview

PivotGrid is a UI component that allows you to display and analyze multi-dimensional data.

In this overview, you can find a map of PivotGrid elements, information about key features, and what to explore next.

1. Field panel: filter fields
2. Field panel: data fields
3. Field panel: row fields
4. Field panel: column fields
5. Field chooser
6. Grand Total row
7. Grand Total column

Review the Visual Elements article for more information.

• Data Binding
  PivotGrid can display data from various sources: an in-memory array, HTML5 web storage, OData service, OLAP server, or a customized data source. To process data from the source, use PivotGridDataSource.

• Summary Calculation Modes
  PivotGrid displays value summaries (totals) in its cells. Choose between predefined summaries, aggregate values, or a implement a custom summary. PivotGrid can also calculate running totals by rows or columns.

• Customizable Layout
  PivotGrid allows you to customize its layout. You can enable or disable multiple PivotGrid elements. Review the Visual Elements article for more information.

• Grouping, Sorting, and Filtering
  PivotGrid groups data for header items and fields. Sort or filter fields through the UI or programmatically.

• Export to Excel
  Export PivotGrid data to Excel in XLSX or CSV format and customize the exported cells.

• Chart Integration
  PivotGrid handles large numeric datasets that can be hard to interpret. For a detailed data visualization, use the Chart component that integrates into PivotGrid.

• Virtual Scrolling
  If PivotGrid is bound to a large dataset, you can enable a virtual scrolling mode to optimize data load time and reduce resource consumption.

• Drill Down
  PivotGrid supports drill-down operations that allow you to retrieve individual records for calculating a specific summary value.

• API

• Demos