FusionCharts Net Wrapper

by Tommy T 20. April 2009 09:48

A few days ago I needed to be able to create quick graphs on a website, so I surfed around for a while and I found Fusion Charts, they had a nice flash based one. So I downloaded the trial and started playing around with it.

To create a chart you needed to write xml data och add it to a webpage with some calls back to to code behind page. I didn’t like that at all so I started to write a .Net Wrapper so that I could create my charts in a more object-oriented way, by creating objects and setting properties. And finally when I am done I call the RenderChart() method in my object, assign the output to a literal and “wham” there is the chart.

This wrapper is in really really realy early stages, i still have more to fix and its messy so please bare with me until im done with it. I just though I would post it, in case anyone needs it.

The charts that are working are, Bar,Column, Area, Pie,Doughnut and Line for now (both 2D and 3D), bots singel and multiseries and stacked.

  • Settings that can me modified are:
  • Chart Cosmetics (? yes its like that on their page)
  • Margins and Padding
  • Divisional Lines and grids.
  • Number Settings and formatting.
  • Global Style definitions and map to graph objects.
  • TrendLines
  • Advanced background settings
  • ToolTip and more….

To use the the object its pretty easy, all youhave to do is creata a class of any of the following objects.

  • FusionChartsWrapper.Charts.ColumnChart – All Column variant sof the chart.
  • FusionChartsWrapper.Charts.AreaChart – Area charts
  • FusionChartsWrapper.Charts.LineChart – For Line charts
  • FusionChartsWrapper.Charts.PieChart – For pie an donut charts.
  • FusionChartsWrapper.Charts.BarChart for the Bar charts.
  • FusionChartsWrapper.Charts.CombinationCharts – are combinations, but in very experimental stage.

All the objects have the same constructow where you need to supply the following paramters:

ChartType (the charttypes you can create, enumeration)
Path (Path to the folder where the flash files are.
Width (with of the chart)
Height (Height of the chart)

Thats it now you have a a chart object youh can work with. To add data series you need to create a Series object and add it to the Dataseries list of the object.

Like this:

Serie serie = new Serie("2009");

And start adding DataPoints to the serie you do like this:

serie.Data.Add(new DataPoint("Jan",1100));

When you are finished you just add the series to the DataSeries List:

serie.Data.Add(new DataPoint("Oct", 2055));
serie.Data.Add(new DataPoint("Nov", 2199));
serie.Data.Add(new DataPoint("Dec", 2322));

grf.DataSeries.Add(serie);

If you are doing a Multi series graph, remove the “name” of the data point and create Categories. You can se very tiny example in the included web site example.

For the moment there is no validation of any kind, so If you get an Invalid Data when rendering the graph, please go to the documentation on the FusionCharts website to see how to create each graph, I will add at a later time but for the moment I am concentrating on adding chart types.

Here is some screen dumps of the charts:

gf1 Multiseries Column chart 2D

gfdonut 3D donut chart.

Like I said, this wrapper is a ongoing project and if you have any problems contact me and Ill try and help but do not expect to get my full attention, replies might take a day or two.

I hope it help you a little and good luck.

Tommy

Source Code and Test web App. Fusion Charts Wrapper Source Code

Tags: ,

ASP.Net | C#

About the me

Im 38 years old and working as a System Architect. I have been woring in the IT field the last 16 years and covered most of the techniques.

In my spare time I train Kyokushin Karate and try to spend as much time as possible with my family.

On this blog I am trying to post things and Code i make or encounter on the www.

Page List

RecentComments

Comment RSS