Next Generation Charting & Data Analysis

Jason Beres [Infragistics] / Tuesday, June 27, 2023

The Chart Toolbar, introduced in 23.1 as a Preview component, is a companion container for UI actions that may be used independently or in conjunction with the Data Chart and Category Chart components. This allows you to simply select from a predefined set of properties on the chart to perform deeper data analysis on the data displayed in the chart.

This is the first iteration of the Chart Toolbar, and we continue to add features and capabilities to the toolbar with each release, with the goal being a full-featured data analytics capability without you needing to write any additional code.  The Chart Toolbar also lets you add your own custom buttons, with custom actions and icons, and full control over where toolbar items live in the Chart Toolbar.

 Chart Toolbar example

The code to add a toolbar is simple, just reference the chart in the Target property.

code snipet explaining how to add a toolbar to a  chart

The Chart Toolbar includes Reset, Zoom and Analysis buttons at the top level.

The Analysis button is where you’ll find all the data analysis features, like Lines, Trend Lines, Series Average, etc. 

 data analysis features, like Lines, Trend Lines, Series Average

The Lines submenu includes Max, Min and Average Value options for the series.

 Max, Min and Average Value options chart options

When you select these options, you’ll see the corresponding values reflected in the chart in a Green, Orange and Red dashed lined.

 line chart example 

Custom Toolbar Actions

The Chart Toolbar gives you the opportunity to add your own button types, with custom icons and Commands for each button.  The list of available buttons includes: 

  • Button
  • Checkbox
  • Icon Button
  • Icon Menu
  • Label
  • Number Input
  • Radio

Each of these tools exposes an OnCommand event that can be triggered upon interacting with them as a mouse click, and new and existing tools can be repositioned and marked hidden using various Toolbar properties.

Wrap Up

This is just the beginning for what we’re calling Next Generation Data Analytics, built directly into the chart controls.  We are excited to ship this Preview with the most commonly requested analysis features.  If there is something you’d like to see in the next release, make sure to shoot me an email at jasonb@infragistics.com so we can get it in.  At the same time, exercise the Toolbar API and add as much new functionality as you’d like!