DevExtreme v24.2 is now available.

Explore our newest features/capabilities and share your thoughts with us.

Your search did not match any results.

React Pivot Grid - Simple Array

The PivotGrid component can display data from an array of objects. Use the dataSource property to bind the PivotGrid to data. This property accepts a PivotGridDataSource instance or its configuration object. Assign your array to the store property of PivotGridDataSource.

To display data in the PivotGrid, assign an array to the fields[] property. Each object in this array configures a single pivot grid field. Assign a field name to the dataField property to populate the pivot grid field with data.

This demo may be temporarily unavailable due to an issue with the UNPKG service we use for resource loading. You can vote on it in the

UNPKG repository

We're working on a fix — sorry for the inconvenience.

Backend API

You can distribute fields between four different areas: row, column, filter, and data. To specify the area, set the area property. Fields that do not belong to any area are displayed in the field chooser.

For more information on fields and areas, refer to the following article: Fields and Areas.