Displaying Charts for Selected Grid Rows
Environment
| Product | Progress® Kendo UI Grid |
Description
How can I display a chart in the Kendo UI for Angular Grid and plot data from the selected Grid rows?
Solution
The Grid provides a built-in Chart Integration feature that uses the Chart Wizard component to quickly create charts from Grid data. The official feature supports generating charts from Grid row and cell selection, launching the Chart Wizard from a Context Menu, and provides data-binding directives and helper methods to simplify the integration.
You can integrate the Kendo UI for Angular Charts with the Kendo UI for Angular Grid to create charts based on the selected data from the Grid.
The provided project features a Grid which allows you to select its rows. Right-clicking the Grid content will open a context menu which lists all available chart types. Selecting a chart type opens a window where the desired chart is rendered. The window provides further configuration options for the chart and an export functionality. For the full project source, refer to this GitHub repository.