OK thanks for the response. Having the ability to display legend items horizontally is something I really need, so will make an attempt to write own legend using the observablecollection of legenditems that I assume gets generated from the series.

Roannak,

Assuming you still check these forums, did you make any progress creating a horizontal legend? This is something that I really need as well. Thanks!

Here's an example of how you might construct a custom legend for the chart.
This will only work if you set the fill on the series, rather than using the random colors.
This also doesn't accomodate an item-wise legend, so let me know if thats what you are trying for. This approach uses a WrapPanel from the Silverlight toolkit to contain the items, but you can customize the CustomLegend template to use any container you want.

The xaml

<Grid x:Name="LayoutRoot" Background="White">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <igChart:XamWebChart x:Name="theChart">
            <igChart:XamWebChart.Legend>
                <igChart:Legend Visibility="Collapsed" />
            </igChart:XamWebChart.Legend>
            
            <igChart:XamWebChart.Series>
                <igChart:Series ChartType="Line" Label="Series 1" Fill="Blue" Stroke="LightBlue">
                    <igChart:Series.DataPoints>
                        <igChart:DataPoint Label="A" Value="1" />
                        <igChart:DataPoint Label="B" Value="2" />
                        <igChart:DataPoint Label="C" Value="3" />
                        <igChart:DataPoint Label="D" Value="4" />
                        <igChart:DataPoint Label="E" Value="5" />
                    </igChart:Series.DataPoints>
                </igChart:Series>

                <igChart:Series ChartType="Line" Label="Series 2" Fill="Green" Stroke="LightGreen">
                    <igChart:Series.DataPoints>
                        <igChart:DataPoint Label="A" Value="5" />
                        <igChart:DataPoint Label="B" Value="4" />
                        <igChart:DataPoint Label="C" Value="3" />
                        <igChart:DataPoint Label="D" Value="2" />
                        <igChart:DataPoint Label="E" Value="1" />
                    </igChart:Series.DataPoints>
                </igChart:Series>

                <igChart:Series ChartType="Line" Label="Series 3" Fill="Red" Stroke="Pink">
                    <igChart:Series.DataPoints>
                        <igChart:DataPoint Label="A" Value="1" />
                        <igChart:DataPoint Label="B" Value="4" />
                        <igChart:DataPoint Label="C" Value="2" />
                        <igChart:DataPoint Label="D" Value="1" />
                        <igChart:DataPoint Label="E" Value="5" />
                    </igChart:Series.DataPoints>
                </igChart:Series>
            </igChart:XamWebChart.Series>
            
            
        </igChart:XamWebChart>
        
        <local:CustomLegend Grid.Column="1" 
                            x:Name="customLegend" Width="150"
                            Chart="{Binding ElementName=theChart}" 
                            HorizontalAlignment="Left"
                            VerticalAlignment="Top"/>

The Custom controls

public class CustomLegend : Control
    {
        public CustomLegend()
        {
            this.DefaultStyleKey = typeof(CustomLegend);
        }

        public static readonly DependencyProperty ChartProperty =
            DependencyProperty.Register(
            "Chart",
            typeof(XamWebChart),
            typeof(CustomLegend),
            new PropertyMetadata(null,
                (o, e) =>
                (o as CustomLegend)
                .OnChartPropertyChanged(
                e.OldValue as XamWebChart, 
                e.NewValue as XamWebChart)));

        public XamWebChart Chart
        {
            get { return (XamWebChart)GetValue(ChartProperty); }
            set { SetValue(ChartProperty, value); }
        }

        private void OnChartPropertyChanged(
            XamWebChart oldValue, XamWebChart newValue)
        {
            if (oldValue != null)
            {
                oldValue.Series.CollectionChanged -= Series_CollectionChanged;
            }

            if (newValue != null)
            {
                newValue.Series.CollectionChanged += Series_CollectionChanged;
            }

            UpdateItems();
        }

        public override void OnApplyTemplate()
        {
            base.OnApplyTemplate();

            ItemsControl = (ItemsControl)GetTemplateChild("PART_ITEMSCONTROL");
            UpdateItems();
        }

        protected ItemsControl ItemsControl { get; set; }

        private void UpdateItems()
        {
            if (Chart == null || ItemsControl == null)
            {
                return;
            }

            var items = from series in Chart.Series
                        select CreateFromSeries(series);

            foreach (var item in ItemsControl.Items.OfType<CustomLegendItem>())
            {
                item.ClearValue(CustomLegendItem.FillProperty);
                item.ClearValue(CustomLegendItem.StrokeProperty);
                item.ClearValue(CustomLegendItem.StrokeThicknessProperty);
                item.ClearValue(ContentControl.ContentProperty);
            }

            ItemsControl.Items.Clear();
            items.ToList().ForEach(ItemsControl.Items.Add);
        }

        private CustomLegendItem CreateFromSeries(Series series)
        {
            var newItem = new CustomLegendItem();
            newItem.SetBinding(
                CustomLegendItem.FillProperty,
                new Binding("Fill") { Source = series });
            newItem.SetBinding(
                CustomLegendItem.StrokeProperty,
                new Binding("Stroke") { Source = series });
            newItem.SetBinding(
                CustomLegendItem.StrokeThicknessProperty,
                new Binding("StrokeThickness") { Source = series });
            newItem.SetBinding(
                ContentControl.ContentProperty,
                new Binding("Label") { Source = series });
            return newItem;
        }

        void Series_CollectionChanged(
            object sender, 
            NotifyCollectionChangedEventArgs e)
        {
            UpdateItems();
        }
    }

public class CustomLegendItem : ContentControl
    {
        public CustomLegendItem()
        {
            this.DefaultStyleKey = typeof(CustomLegendItem);
        }

        public static readonly DependencyProperty FillProperty =
            DependencyProperty.Register(
            "Fill",
            typeof(Brush),
            typeof(CustomLegendItem),
            new PropertyMetadata(null));

        public Brush Fill
        {
            get { return (Brush)GetValue(FillProperty); }
            set { SetValue(FillProperty, value); }
        }

        public static readonly DependencyProperty StrokeProperty =
          DependencyProperty.Register(
          "Stroke",
          typeof(Brush),
          typeof(CustomLegendItem),
          new PropertyMetadata(null));

        public Brush Stroke
        {
            get { return (Brush)GetValue(StrokeProperty); }
            set { SetValue(StrokeProperty, value); }
        }

        public static readonly DependencyProperty StrokeThicknessProperty =
          DependencyProperty.Register(
          "StrokeThickness",
          typeof(double),
          typeof(CustomLegendItem),
          new PropertyMetadata(1.0));

        public double StrokeThickness
        {
            get { return (double)GetValue(StrokeThicknessProperty); }
            set { SetValue(StrokeThicknessProperty, value); }
        }
    }

The default styles of the custom controls:

<Style TargetType="local:CustomLegend">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:CustomLegend">
                    <Border Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                        <ItemsControl x:Name="PART_ITEMSCONTROL">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <toolkit:WrapPanel />
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                        <toolkit:WrapPanel />
                        </ItemsControl>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style TargetType="local:CustomLegendItem">
        <Setter Property="Margin" Value="3" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:CustomLegendItem">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Rectangle RadiusX="3" RadiusY="3" 
                                   Width="13" Height="13" 
                                   Fill="{TemplateBinding Fill}" 
                                   Stroke="{TemplateBinding Stroke}" 
                                   StrokeThickness="{TemplateBinding StrokeThickness}"
                                   />
                        <ContentPresenter Margin="5,0,0,0"  
                                   Grid.Column="1"
                                   Content="{TemplateBinding Content}" 
                                   />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Hope this helps!

-Graham

In the legend, is there a wordwrap feature for legend lables that are too long so you dont get the ... at the end?

You can set chart.Legend.LegendItemStyle property to a style like this:

<Style TargetType="igChart:LegendItem">
 <Style.Setters>
  <Setter Property="Template">
   <Setter.Value>
    <ControlTemplate TargetType="igChart:LegendItem">
     <StackPanel Orientation="Horizontal">
      <Rectangle RadiusX="3" RadiusY="3" Width="13" Height="13"
           Fill="{TemplateBinding Fill}"
           Stroke="{TemplateBinding Stroke}"
           StrokeThickness="{TemplateBinding StrokeThickness}"
      />
      <TextBlock HorizontalAlignment="Left"
           Text="{TemplateBinding Text}"
           Width="50"
           TextWrapping="Wrap"
      />
     </StackPanel>
    </ControlTemplate>
   </Setter.Value>
  </Setter>
 </Style.Setters>
</Style>

I get these errors when I try it set the style for hte legend

Error 1 The property 'Legend' is set more than once. 

Error 1 The type 'XamWebChart' does not support direct content.

 in ....

<UserControl xmlns:igChart="clr-namespace:Infragistics.Silverlight.Chart;assembly=Infragistics.Silverlight.Chart.v9.2"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:local="clr-namespace:ReportingControls" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" x:Class="ReportingControls.TrendsGraph"

    Height="400" mc:Ignorable="d">

    <Grid x:Name="LayoutRoot" Background="White">

        <igChart:XamWebChart x:Name="ChartPerformance" Height="300" Margin="0,15,0,10">

            <igChart:XamWebChart.Scene>

                <igChart:Scene>

                    <igChart:Scene.GridArea>

                        <igChart:GridArea Background="#FFFFFFFF" />

                    </igChart:Scene.GridArea>

                </igChart:Scene>

            </igChart:XamWebChart.Scene>

            <igChart:XamWebChart.Legend>

                <igChart:Legend Visibility="Visible" />

            </igChart:XamWebChart.Legend>

            <igChart:XamWebChart.Axes>

                <igChart:Axis x:Name="XAxis" AxisType="PrimaryX" Stroke="#FFEFEFEF">

                    <igChart:Axis.MajorTickMark>

                        <igChart:TickMarkGroup Stroke="#00000000" />

                    </igChart:Axis.MajorTickMark>

                    <igChart:Axis.Label>

                        <igChart:LabelGroup FontSize="10" Foreground="#666666" Angle="90" />

                    </igChart:Axis.Label>

                    <igChart:Axis.MajorGridline>

                        <igChart:GridlineGroup Stroke="#59ABABAB" StrokeThickness="0.5" />

                    </igChart:Axis.MajorGridline>

                </igChart:Axis>

                <igChart:Axis x:Name="YAxis" AxisType="PrimaryY" Stroke="#FFABABAB">

                    <igChart:Axis.MajorTickMark>

                        <igChart:TickMarkGroup Stroke="#00000000" />

                    </igChart:Axis.MajorTickMark>

                    <igChart:Axis.Label>

                        <igChart:LabelGroup Format="{}{0:p}" FontSize="10" Foreground="#666666" />

                    </igChart:Axis.Label>

                    <igChart:Axis.MajorGridline>

                        <igChart:GridlineGroup Stroke="#59ABABAB" StrokeThickness="0.5" />

                    </igChart:Axis.MajorGridline>

                </igChart:Axis>

            </igChart:XamWebChart.Axes>

        </igChart:XamWebChart>

    </Grid>

</UserControl>