The FreeSilverlightChart Control provides charting solution in a silverlight environment. It uses XAML and C# to display charts on the silverlight platform.
The FreeSilverlightChart Control supports the following chart types:
The FreeSilverlightChart Control uses a model to access the data for displaying a chart. The specific
model class must be of type FreeSilverlight.ChartModel
.
The chart values are draw using YValues 2D array property by the chart modal. Each element in this array must contain an array of doubles. These values in this array represent a series values with in a group. For XYLine and Scatter plots XValues 2D array property is also required.
For Pie chart and Funnel chart if the YValues array length is more than one, multiple charts are shown. Each array element in the YValues is used to draw one chart.
For circular and semiCircular gauge charts only one series in the YValues is used. Multiple charts are displayed if size of YValues array is greater than one. Each array element in the YValues is used to draw one chart.
The FreeSilverlightChart Control can be easily drawn on any canvas once a ChartModel is specified and a particular chart type is choosen. The following is a code snipped showing its usage:
<UserControl x:Class="ChartUsage.Page" xmlns="http://schemas.microsoft.com/client/2007" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:app="clr-namespace:AdvanceUsage"> <Canvas Width="680" Height="400" x:Name="parentCanvas"/> </UserControl>
public void Page_Loaded(object o, EventArgs e) { // Load the chart model my data ChartModel model = _loadChartModel(); // create the chart and set the prefered properties Chart chart = Chart.CreateChart(Chart.ChartType.PIE, model); chart.IsPerspective = true; chart.LegendPosition = location; chart.AnimationDuration = 1.5; chart.YMajorGridCount = yMajorCount; chart.Format = myformat; // set the bounds of the chart control chart.SetBounds(new Rect(0, 0, parentCanvas.Width, parentCanvas.Height)); // add the custom component parentCanvas.Children.Add(chart); // setup the event handler chart.ChartClicked += new ChartEventHandler(ChartClicked); // now draw it chart.Draw(); }
The FreeSilverlightChart Control provides flexibility for labeling of chart data. The YValues and group labels are the two types of labels used in a chart.
The formatting of the values displayed as labels is controlled by the Format property. The default format is "$#,##0.00;($#,##0.00);0".
The FreeSilverlightChart Control displays displays vertical and horizontal grid lines inside charts.
The grid line for YValues(y axis for verticalBar, area, line etc. and x axis for horizontalBar) are controlled by YMajorGridLineCount. The number of yValue labels displayed are also controlled by this attribute. The maximum and minimum values are displayed and then a value is displayed corresponding to each major grid line.
For gauge charts minor grid lines are displayed within a major grid section. YMinorGridLineCount attribute is used to control this feature.
The FreeSilverlightChart Control displays the series labels as a legend. The LegendPosition property of the chart component controls the display of the legend. The legend can be turned off by setting this attribute to "FreeSilverlightChart.Chart.LegendLocation.NONE". Please note that legend is never displayed for circular and semicircular gauge chart since these charts display only one series.
The FreeSilverlightChart Control can be displayed in perspective(2.5D) or in 2D. The perspective is purely a visual representation and does not provide any additional detail from a chart in 2D. Please note that perspective flag does not have any effect on radar and gauge charts.
The FreeSilverlightChart Control provides support for animation during initial load. The animation is controlled by AnimationDuration property (in seconds). The default value is 1.5 seconds. Setting this attribute to 0 will turn off animation.
Please note that the animation should be used with caution, it should not be used at the expense of usability. For e.g. if a page is periodically updating charts using a timer, animation will effect the usability of the chart.
The FreeSilverlightChart Control provides support for skinning of the chart elements. The chart elements
are rendered by using XAML returned by a class that implements FreeSilverlightChart.LookAndFeel
interface. A Look and Feel can be registered with the Control using Chart.RegisterLookAndFeel
static method.
The chart chart control comes with two LookAndFeel implementations : 1)GradientLookAndFeel and 2)TransparentLookAndFeel. A new LookAndFeel can be created by either extending one of these two classes or implementing FreeSilverlightChart.LookAndFeel
interface. The GradientLookAndFeel is the default LookAndFeel that is registered with the Chart control.
The FreeSilverlightChart Control displays tooltips in response to the user moving the mouse on the chart data. The chart control may display multiple tooltips for area and radarArea charts if the user moves the mouse inside an area that is enclosed by multiple series. For line chart and area charts the tooltips display interpolated values. The tooltips display can be turned off by setting DisplayToolTip property to "false".
The FreeSilverlightChart control triggers chartClicked event when the user drills clicks on the chart
data.
The event handler must have the following signature: ChartClicked(object sender, ChartEventArgs e)
chart.ChartClicked += new ChartEventHandler(ChartClicked); .... private void ChartClicked(object sender, ChartEventArgs e) { // Handle the click based on the data that was clicked }