Flex Tutorials

Flex Video Tutorials and Examples

Flex Charts Product Overview

FusionCharts for Flex is a charting component for Adobe® Flex® solutions. It helps you build exciting reports in your Flex projects in no time at all!

Built as a native Flex component, FusionCharts for Flex internally harnesses the power of FusionCharts v3 and FusionWidgets v3framework, which is the industry leader in Adobe Flash Charting. The good part is that as Flex developers, you need not worry about what is happening behind the scenes. FusionCharts for Flex smartly abstracts the internals of FusionCharts, thereby exposing Flex API and events that are already familiar to you!

FusionCharts for Flex lets you render a variety of chart types, all with the same ease. It currently offers over 57 types of charts and gauges spanning 2D charts, 3D charts, realtime gauges, etc. The following types charts and gauges can be rendered using FusionCharts for Flex:

  • Standard charts like Column, Bar, Line, Pie, Doughnut, Area etc.
  • Multi-series charts having multiple datasets for comparison
  • Stacked charts having datasets built over one another
  • Combination charts that allow you to combine different chart types on the same axis or dual axis
  • Funnel and Pyramid charts
  • Bubble and XY Plot (scatter charts)
  • Charts with logarithmic axis
  • Spline and Spline Area charts
  • True and interactive 3D charts
  • Gauges (Angular, Cylindrical, Linear, etc.) that can be updated in real-time
  • Spark charts (miniature, word-sized charts) and Bullet graphs

Irrespective of whether you are using Flex Builder 2, 3, Flex SDK or any other Flex development kits, FusionCharts for Flex efficiently works with all of them.

FusionCharts for Flex has a flexible and easy to learn API that allows you to create charts in very few lines of code as well as do advanced things like exporting them as images/PDFs and extracting data as CSV/XML.

More about FusionCharts for Flex:

So why should I use FusionCharts and not Adobe Flex charts?

We're still not asking you to dump the licenses of Adobe Flex Charting that you might have purchased - that would be a bold statement to make. Instead, we are asking you to use both the products in conjunction to cover all your charting needs.

Both products have their niche and FusionCharts covers some of the aspects not fully covered by Flex charting. Basically, if you're looking for more chart types and chart configuration options, we might be able to fit in. Also, some charts in FusionCharts suite are highly interactive like the pie and doughnut charts which allow you to slice out individual pie, rotate the chart, seamlessly transform from 3D to 2D etc.

Listed below are a few justifications of why you should or shouldn't use FusionCharts for Flex:

Pros:

  • Load charts as and when you need, instead of packing everything in your main SWF thereby increasing the file size. The charts are present as external SWF files that allow them to be loaded on-demand.
  • Lots of chart types. FusionCharts for Flex features some exciting chart types like scroll charts, True 3D chart, funnel and pyramid charts, bubble and scatter charts and few more that are unique.
  • Many charts in FusionCharts suite offer unique interactivity options like the slicing/rotation in pie and doughnut charts, 3D capabilities in True 3D charts, 2D to 3D and vice versa view-state change in Funnel, Pyramid and Pie charts etc.
  • Lots of configuration options for each chart that help you configure both the functional and cosmetic aspects of each chart to your satisfaction.

Cons:

  • You need to upload/distribute the chart SWF files along with your compiled Flex SWF file.

Sounds good. How do I get started?

To get started, you'll first need to download FusionCharts for Flex. Next, follow the installation instructions in documentation.

Post that, getting started is as easy as dragging and dropping FusionCharts for Flex component from the toolbar into your project. When you now build your project, it kicks FusionCharts for Flex into action and it quickly shows up the default chart. After your wow moment, now use the visual configuration options to change chart type, configure size, select data method or configure this default chart.

To power the chart using your data, you can use the numerous data connection APIs exposed by the component. FusionCharts for Flex can natively connect to data stored in Flex structures like Array, XMLList, Model etc. If you wish to connect to other data sources like Blaze DS and webservices, these simple APIs can be used for the same as well. Our extensive documentation and code examples can be used as starting point to learn these.

You mentioned something happening behind the scenes. Tell me about it - I'm curious!

Okay, if you must know, here it is. FusionCharts v3 charts are coded in ActionScript 2 (Flash 8). These charts take in XML data and render using the configuration and data provided in those XML files. As you might be aware, starting Flash Player 9, there are two AVMs (ActionScript Virtual Machine) in it - AMV 1 for running AS2.0 and older code, and AVM2 for running AS3.0 and later code. FusionCharts v3 still is AS2 code and runs in AVM1.

As such, if you're wondering how we've converted them into Flex components, let us explain how we've achieved the same - we've notported them to ActionScript 3. Instead, we've modified the existing FusionCharts v3 charts so that they can be efficiently loaded in your Flex solutions and then be controlled from your Flex code. For cross communication between AVM1 and AVM2, we've used FlashInterface (big thanks to those guys). While we did come across a lot of bottlenecks to enable this cross communication, we've managed to solve them all for you. As such, you do not need to bother anything about cross AVM issues.

Additionally, since FusionCharts internally uses XML as its only data source, we've provided Flex APIs to help help you convert your data stored in Array, XML List, Model etc. to FusionCharts XML format. As such, you would not have to worry about hand-coding any of the XML.

Does that cure your itch? If so, go ahead and download FusionCharts for Flex now!

0 comments:

Post a Comment

Sponsors

Latest Flex Tutorials