Infragistics logo
메뉴
.NET and JavaScript UI Controls
Version

Using Legend with XamShapeChart

This topic explains, with a code example, how to add a legend to the XamShapeChart control.

Introduction

The XamShapeChart control has support for showing legends, but does not currently display legends for any series in the chart control by default. In order to show a common Legend for your shape chart, you need to add a Legend object to your application and bind it to the Legend property of the XamShapeChart control.

The Legend element pulls the names of its items from the Title property of the Series that are plotted in the chart, and it will show your series' names in the format of "SeriesType (XMemberPath vs YMemberPath)" by default. In order to prevent this, you should use the SeriesAdded event of the XamShapeChart. The event arguments of this event can net you the series that is being added by using the Series property, which you can then use to set the Title property and modify the way your series is shown in the Legend.

Code Example

The following example code demonstrates how to add a common Legend for multiple series plotted in the XamShapeChart control and format the name of those series using the SeriesAdded event. This code example uses the following data for the shape chart:

In C#:

public class ScatterData : List<List<Point>>
{
    public ScatterData()
    {
        List<Point> list1 = new List<Point>();
        List<Point> list2 = new List<Point>();

        list1.Add(CreatePoint(20, 20));
        list1.Add(CreatePoint(20, 40));
        list1.Add(CreatePoint(40, 40));
        list1.Add(CreatePoint(40, 20));

        list2.Add(CreatePoint(60, 20));
        list2.Add(CreatePoint(60, 40));
        list2.Add(CreatePoint(80, 40));
        list2.Add(CreatePoint(80, 20));

        this.Add(list1);
        this.Add(list2);
    }

    private Point CreatePoint(double x, double y)
    {
        Point point = new Point() { X = x, Y = y };
        return point;
    }
}

In XAML:

<Grid x:Name="layoutRoot">
    <ig:XamShapeChart x:Name="shapeChart" ItemsSource="{Binding}"
                      Legend="{Binding ElementName=legend}"
                      SeriesAdded="shapeChart_SeriesAdded"/>

    <ig:Legend x:Name="legend" />
</Grid>

In C#:

var shapeChart = new XamShapeChart();
var legend = new Legend();

shapeChart.ItemsSource = new ScatterData();
shapeChart.Legend = legend;
shapeChart.SeriesAdded += shapeChart_SeriesAdded;

layoutRoot.Children.Add(shapeChart);
layoutRoot.Children.Add(legend);

int count = 1;
private void shapeChart_SeriesAdded(object sender, Infragistics.Controls.Charts.ChartSeriesEventArgs args)
{
    Series series = args.Series;
    series.Title = "Series " + count.ToString();
    count++;
}

In VB:

Dim shapeChart = New XamShapeChart()
Dim legend = New Legend()

shapeChart.ItemsSource = New ScatterData()
shapeChart.Legend = legend
shapeChart.SeriesAdded += shapeChart_SeriesAdded

layoutRoot.Children.Add(shapeChart)
layoutRoot.Children.Add(legend)

Dim count As Integer = 1
Private Sub shapeChart_SeriesAdded(sender As Object, args As Infragistics.Controls.Charts.ChartSeriesEventArgs)
	Dim series As Series = args.Series
	series.Title = "Series " + count.ToString()
	count += 1
End Sub

If the above steps are followed correctly, the resultant XamShapeChart should look like the following:

shapechart_legend.png

Related Content