A chart is a great way to visualize data. Did you know that you can easily add a chart to the DevExtreme PivotGrid widget? And the chart will update instantly with the PivotGrid:
In previous versions of DevExtreme (15.2 and earlier), you could display PivotGrid data with a chart but it was very complex and you had to write custom code.
Starting with the v16.1 release, we introduced a new method for chart integration - bindChart.
How does it work?
To integrate the two widgets, first create new instances of PivotGrid and Chart, then call the bindChart method:
var pivotGrid = $("#pivotContainer").dxPivotGrid(...),
chart = $("#chartContainer").dxChart(...),
integrationOptions = {...}
pivotGrid.bindChart(chart, integrationOptions);The bindChart method accepts two arguments: a Chart instance and an object containing integration options. This allows you to adjust data fields, series, value formatting, panes and axes, and many others options.
Try the online demo.
Learn more in the DevExtreme documentation.
This feature is a part of the DevExtreme v16.1 release. Thanks!
Create highly responsive web apps for touch-enabled devices and traditional desktops.
From desktops to mobile devices, DevExtreme HTML5 Data Grid delivers the flexibility you’ll need to build apps that reach the widest audience and deliver touch-first user experiences to power your next great interactive website.
Download a free and fully-functional version of DevExtreme now: Download DevExtreme
Free DevExpress Products – Get Your Copy Today
The following free DevExpress product offers remain available. Should you have any questions about the free offers below, please submit a ticket via the
DevExpress Support Center at your convenience. We’ll be happy to follow-up.