FlexChart: Evolving the best .NET chart control

Charts are all about the impact that they should leave on the target audience: Did it convey the intended information? Was it actionable? Was it good enough to facilitate key decision-making? One makes minor visual changes in different chart elements (colors, fonts, position, text formats, tooltips) to meet the end goal of having a chart that makes an impact on its audience.

To meet the charting needs of our users, ComponentOne introduced the C1Chart control in 2002, not long after the first public release of .NET/WinForms. A popular control in its heyday, C1Chart met the needs of our users very well. However, in keeping with our mission to help our users with their business needs and with ever-demanding data visualization requirements (as well as to provide our users with similar experiences across platforms), we decided to come up with a new charting control for .NET.

FlexChart was originally developed for JavaScript and introduced as part of the Wijmo5 suite in 2014, but we liked the result and used its main principles — a concise object model as well as a flexible and extensible architecture — for the new FlexChart control for .NET. We moved C1Chart into maintenance mode, and set about making FlexChart a control that can make all of the necessary minor changes for your chart to make a major impact.

In this blog, we'll talk about the key aspects, updates, and more that have enhanced the chart-making experience in FlexChart:

<a name="insight"

A Quick Insight into FlexChart

We created FlexChart based on our existing charting tools with the objective to give similar coding experiences across platforms, meet business-specific charting needs, and provide a modern look and feel. We wanted FlexChart to be a flexible and feature-rich tool to give a better developer and end-user experience. Some of the key aspects we considered when we designed FlexChart are in the chart below.

Key Aspects

Given the simple and easy-to-use API of FlexChart, we don’t consider adding a designer to be a priority — though we may consider it for the distant future. In addition, FlexChart doesn't currently support 3D charts: 3D charts haven’t been popular for a long time. But if you need one to visualize your data, you can use C1Chart.

FlexChart is now the flagship charting tool for ComponentOne Studio Enterprise and is supported on a wide range of platforms:

  • WinForms, WPF, and UWP for Desktop
  • ASP.NET MVC and JavaScript (Wijmo) for web
  • Xamarin for native mobile

In this blog, we'll focus on the FlexChart updates for the Desktop platforms (WinForms, WPF, and UWP), which have a shared core code. If you haven't read about FlexChart before and want to get started, you can read up on how with our 'Get Started with FlexChart' blog post.

<a name="snapshot"

A Snapshot of Past Releases

Earlier in 2016, we introduced support for most of the common chart types in FlexChart, along with parity with Excel charts. We also included significant charting features like custom axis labels and support for Mixed/Composite charts. While you can check out the FlexChart documentation for more information, here's a snapshot of prior releases for FlexChart and FinancialChart:

FlexChart

Chart Types

  • Bar/Column
  • Line/LineSymbols
  • Scatter
  • Spline/SplineSymbols
  • Area/Spline Area
  • Bubble
  • Candlestick/HLOC
  • FlexPie
  • Radar/Polar
  • Sunburst
  • Waterfall
  • Funnel
  • ErrorBars
  • Box and Whisker
  • TreeMap
  • and more*

*Cartesian charts can be stacked or combined to create more chart types.

Bubble Chart

Chart Features

  • Flexible data binding
  • DirectX and Direct2D rendering
  • Support for Mixed (aka Composite) charts
  • Categorical, Numerical, DateTime, and Logarithmic axes
  • Support for Multiple Axes
  • DataLabels and Annotations
  • Legends
  • Multiple Plot Areas
  • Conditional Formatting
  • Custom Axis Labels
  • Headers and Footers
  • Interactivity options
    • Tooltips
    • RangeSelectors
    • AxisScrollbars
    • Zoom and scroll (Gesture support to zoom and pan in UWP and WPF)
    • Built-in selection support
    • LegendToggle to control series visibility from the chart legend itself
  • Chart and Chart elements styling
  • MVVM support for WPF and UWP
  • Export and Print

Multiple Plot Areas

Specialized FinancialChart control

FinancialChart is a separate chart control for creating stock trending visualizations that extends FlexChart. FinancialChart is available in ComponentOne Studio Enterprise and Ultimate.

Chart Types

  • Heikin-Ashi
  • LineBreak
  • Renko
  • Kagi
  • ColumnVolume
  • EquiVolume
  • CandleVolume
  • ArmsCandleVolume

Features

  • Trendlines and Moving Averages
  • Technical Indicators and Overlays
  • Fibonacci tools

<a name="v3"

What's New in the 2017 v3 Release?

The 2017 v3 release of FlexChart is our second biggest release— after our first —in terms of the number of new chart types that we’ve added along with several feature improvements. All the newly-added chart types and features are listed below:

FlexChart Chart Types

  • Point and Figure**
  • Histogram
  • RangedHistogram
  • Step
  • StepArea
  • StepLineSymbols
  • Floating Bars
  • Gantt charts
  • and more*

*Cartesian charts can be stacked or combined to create more chart types.

**Applicable for FinancialChart

Floating Bar

FlexChart Features & Demos

  • Grouping in chart legend
  • Built-in drilldown for Sunburst and TreeMap charts
  • Line Styles in LineMarkers
  • Saving FlexPie, Sunburst, and TreeMap charts to images
  • Getting calculated values for Financial Indicators*
  • Forecasting in Trendlines*
  • Sample demonstrating runtime interactions with Annotations (available for WinForms and WPF)
  • Technical Indicator Demo

*Applicable for FinancialChart

Legend Grouping

<a name="next"

What's Next?

The coming releases will see continued efforts to make FlexChart a better charting tool. We’ll be focusing on improving existing chart elements — like data labels and axis labels — by giving you more flexibility to control their rendering. You can also expect more from FlexChart in terms of performance, as that’s another area where we plan to invest our time and efforts.

Along with the feature improvements, you will continue to see new chart types in our future releases. We’re still in the process of finalizing a list for this and would like to include charts covering a wide spectrum, ranging from common charts such as Pareto and Heatmap to charts specific for industries and businesses like healthcare, science, and engineering.

Let's Shape FlexChart Together

One of GrapeCity's symbols is the cluster of grapes: a grouping of objects in which the whole is greater than the sum of its parts

One of GrapeCity's symbols is the cluster of grapes: a grouping of objects in which the whole is greater than the sum of its parts. At the heart of this concept is a sense of working together, and an integral part of this "cluster" is you — our customers. FlexChart will continue to evolve if you continue to give us feedback, suggestions, and ideas.

Do you have any specific charts in mind, or are there any features which you think might be useful for your charting needs? You can drop in your suggestions in the comments below or use our Forums/Support channels to contact us. We’re always happy to hear from you.

Get the latest version of FlexChart

Ankit Gupta

comments powered by Disqus