Skip to content

SyncfusionExamples/Create-a-Pivot-Table-in-a-Blazor-Server-Application

Repository files navigation

Create a Pivot Table in a Blazor Server Application

The Blazor Pivot Table is a powerful control used to organize and summarize business data and display the result in a cross-table format. This quick-start Blazor server app project will help you create the Blazor Pivot Table from Syncfusion in a Blazor server app. This example explains how to add required fields in the Blazor Pivot Table and shows you how to add useful features to your Pivot Table too, like a grouping bar, filtering, formatting, and a field list.

Prequisites

  • Visual Studio 2022

How to run the project

  • Checkout this project to a location in your disk.
  • Open the solution file using the Visual Studio 2022.
  • Restore the NuGet packages by rebuilding the solution.
  • Run the project.

Further help

To get more help, check out the ASP.NET Core Blazor documentation.

Features and benefits

Pivot Chart

Blazor Pivot Charts can easily be integrated with pivot data rendered independently, including functionality for plotting more than 20 types of pivot charts. The end user experience is greatly enhanced by including a set of user-interactive features such as zooming, panning, crosshair, trackball, events, selection, and tooltip. Highly interactive field list options are available for generating reports on top of the relational data dynamically.

Responsive and touch-friendly

All features will work on touch devices. Features such as drill up/down, filtering, sorting, and report manipulation can be done on the fly. Responsive support allows the component layout to be viewed on various devices. Allows the pivot table field list UI to be viewed according to various devices.

Pivot table field list and group fields

The Blazor Pivot Table field list and group fields option are automatically populated with fields from the bound data source. They allow end-users to drag, filter, and sort fields, as well as create pivot report at runtime.

Drill down/Drill up

Provides built-in drill down (expand) and drill up (collapse) capabilities to visualize data both in a detailed view and abstract view, respectively. By default, data is displayed in a grouped manner.

Defer layout update

Users can refresh the component on demand instead of during every UI interaction in the Blazor Pivot Table.

Editing and updating

Users can create, read, update, and delete operations for raw data at runtime and update their changes to the underlying data source, thereby reflecting the information in all corresponding cells. The component supports various edit modes such as inline, dialog, batch edit, and column edit through an interactive UI.

Filtering

Built-in normal and Excel-like filters with advanced filtering options to easily filter and view data as required. It is also possible to filter programmatically.

Sorting

Sorting supports to order rows and columns based on either labels or values.

Aggregation

Users can perform calculations on a group of values using the aggregation option. By default, values are added together. The other aggregation types are average, minimum, maximum, count, distinct count, product, index, population stdev, sample stdev, population var, sample var, running totals, difference from, % of difference from, and % of grand total.

Calculated field

The calculated field, otherwise known as unbound field, generates a unique field with the user’s own calculated value by executing a simple user-defined formula.

Drill through

The drill-through feature easily obtains a list of raw items for a particular value cell or summary cell.

Totals

Subtotals and grand totals are calculated automatically by the pivot engine in the component and displayed in the pivot table. This helps users make decisions based on the totals. Also, users can show or hide subtotals and grand totals for rows and columns.

Conditional formatting

Allows users to define conditions that, when met, format font style, text color, background color, and font size for values and summary cells.

Number formatting and date formatting

Number formatting and date formatting helps transform the appearance of the actual cell value.

Grouping date and number

The Blazor Pivot Table component automatically groups dates and numbers, so that the date type can be formatted and displayed based on year, quarter, month, day, and more. The number type can be grouped by range, such as 1-5 or 6-10.

Frozen header

You can freeze row and column headers to scroll and compare cell values with the corresponding row and column headers.

Toolbar

The Toolbar feature provides a built-in interface for pivot tables to select frequently used features interactively for easy access. These features include New Report, Save Report, Save As Report, Rename Report, Delete Report, Report List, Show Grid, Show Chart, Show or Hide Totals, Export Reports, and more.

Exporting

Export Blazor pivot table data to Excel, PDF, and CSV formats. You can also customize the exported document by adding the header, footer, and cell properties like type, style, and position programmatically.

Globalization and localization

  • Globalization - Enables users from different locales to use the component by formatting the date, currency, and numbering to suit locale preferences. This uses an internalization (i18n) library for handling value formatting.
  • Right to left (RTL) - Supports right-to-left rendering and allows the text direction and layout of the component to be displayed from right to left.
  • Localization - You can localize all the component strings in the user interface as needed and use the localization (l10n) library to localize UI strings.

Developer-friendly API

For a great developer experience, flexible built-in APIs are available to define and customize the Blazor Pivot Table component. Developers can customize the user interface (UI) completely using code easily.

Cross-browser compatibility

It is necessary for the Blazor pivot table to work on all major browsers across Windows, macOS, Linux, Android, and iOS. The component is written in pure JavaScript and does not require any plugin on any modern web browsers. It provides a seamless working experience for Chrome, Firefox, Internet Explorer, Safari, and Opera browsers.

Related links

Learn More about Blazor Pivot Table

Download Free Trial

Pricing

Documentation

Online Examples

Watch a How-to Video

Community Forums

Suggest a feature

About Syncfusion Blazor Components

Syncfusion's Blazor components library offers over 70 UI components to work with Blazor server-side and client-side (Blazor WebAssembly) projects seamlessly. In addition to Pivot Table, we provide popular Blazor components such as DataGrid, Charts, Scheduler, Diagram, and Word Processor.

About Syncfusion

Founded in 2001 and headquartered in Research Triangle Park, N.C., Syncfusion has more than 23,000+ customers and more than 1 million users, including large financial institutions, Fortune 500 companies, and global IT consultancies.

Today, we provide 1600+ controls and frameworks for web (Blazor, ASP.NET Core, ASP.NET MVC, ASP.NET WebForms, JavaScript, Angular, React, Vue, and Flutter), mobile (Xamarin, Flutter, UWP, and JavaScript), and desktop development (Windows Forms, WPF, WinUI(Preview) and UWP). We provide ready-to-deploy enterprise software for dashboards, reports, data integration, and big data processing. Many customers have saved millions in licensing fees by deploying our software.


[email protected] | www.syncfusion.com | 1-888-9 DOTNET

About

This sample explains how to create a Blazor Scheduler component in the Blazor Server App. It contains features such as grouping, filtering, formatting and etc.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published