• Material
  • Fabric
  • Bootstrap
  • Bootstrap v4
  • High Contrast
Preferences
Theme Selection
Mode Selection
Touch
Mouse
Localization
*Translated by Google Translator.
Currency

Example of Pivot Chart in ASP.NET MVC Pivot Table Control

This sample demonstrates rendering a pivot chart using pivot data. Users can explore the data through drill-up and drill-down operations by clicking the grouping labels. The field list can also be used to change the report at runtime.

DEMO
SOURCE

In this sample, the pivot table control plots a chart based on the pivot report bound to it. This can be achieved by setting the property displayOption.view to Chart. The built-in options are:

Table -> Renders pivot table only, which is the default.
Chart -> Renders pivot chart only.
Both -> Renders both pivot table and pivot chart.

You can change the chart types using the Chart Types dropdown list separately. The chart types can be set using the chartSettings.chartSeries.type property. The built-in chart types are:

Column
Line
Spline
Bar
Area
StepArea
SplineArea
StackingColumn
StackingArea
StackingBar
StepLine
Pareto
Bubble
Scatter
StackingColumn100
StackingBar100
StackingArea100
Polar
Radar

In the sample, the field list option is enabled, through which you can see the result in the chart by altering the report dynamically.

Injecting Module:

The pivot table features are segregated into individual modules. To take advantage of chart support, we need to inject the PivotChart module using the PivotView.Inject(PivotChart) method.