Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
320
How to customize legend order in a xamDataChart Column Series.
posted

I understand that the order of the legend is order by the way my series are being added to the xamDataChart.
However, looking my example, I combined a stacked column series and column series. Now there's a requirement to change ONLY the order of the Legend while maintaining the series order in the chart. (see picture example). I need to move "Projected Closed" to the bottom of the legend list. 
This is a continuation of my previous post but I was not able to get a reply so I'm reposting as a separate question.
http://es.infragistics.com/community/forums/p/79627/401810.aspx#401810

 

I was able to find something similar but for a xamWebChart but couldn't apply it to a xamdataChart

http://es.infragistics.com/community/forums/p/49819/262641.aspx#262641

Here are my xaml snippets to add each series and the legend. How would I go about doing what seems like a simple thing?
many Thanks! 

<ig:StackedColumnSeries XAxis="{Binding ElementName=xamDemandLogXAxis}"
YAxis="{Binding ElementName=xamDemandLogYAxis}" 
Legend="{Binding ElementName=TitleLegend}"
ItemsSource="{Binding}">
<ig:StackedColumnSeries.Series> 
<ig:StackedFragmentSeries Title="Projected Closed" Brush="#FF2D63C3" ValueMemberPath="ProjectedClosed">
<ig:StackedFragmentSeries.MarkerTemplate>
<DataTemplate >
<Grid Width="40" Height="30" Margin="0,0,0,10"><TextBlock Text="{Binding Item.ProjectedClosed, Converter={StaticResource ResourceKey=ColumnValue}}" Foreground="Beige" FontSize="12" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Top"></TextBlock></Grid>
</DataTemplate>
</ig:StackedFragmentSeries.MarkerTemplate>
</ig:StackedFragmentSeries>

Legend Snippet

<ig:Legend x:Name="TitleLegend" Content="Legend" 

VerticalAlignment="Top" HorizontalAlignment="Right"> 
</ig:Legend>

 

  • 34510
    Offline posted

    Hi Steven,

    The only way I've found to change the order of the Legend is to dig into the controls visual tree and grab the StackPanel that is used to contain each individual item.  From there you can rearrange the children as you like.  I used the following behavior for this: 

    public class RearrangeLegendItems : Behavior<Legend>
    {
        public Legend Legend { get { return this.AssociatedObject; } }
    
        protected override void OnAttached()
        {
            base.OnAttached();
    
            Legend.LayoutUpdated += new EventHandler(Legend_LayoutUpdated);
        }
    
        void Legend_LayoutUpdated(object sender, EventArgs e)
        {
            // Get the stack panel that contains the legend items.
            ScrollContentPresenter presenter = (ScrollContentPresenter)FindElementByName(Legend, "ScrollContentPresenter");
            StackPanel sPanel = (StackPanel)(presenter.Content as ContentPresenter).Content;
    
            // Rearrange the legend items here.
            UIElement firstElement = sPanel.Children[0];
            sPanel.Children.RemoveAt(0);
            sPanel.Children.Add(firstElement);
    
            // Unhook the event so we don't do this all the time.
            Legend.LayoutUpdated -= Legend_LayoutUpdated;
        }
    
        DependencyObject FindElementByName(DependencyObject parent, string name)
        {
            if ((parent as FrameworkElement).Name == name)
                return parent;
    
            int childCount = VisualTreeHelper.GetChildrenCount(parent);
            for (int i = 0; i < childCount; i++)
            {
                DependencyObject child = VisualTreeHelper.GetChild(parent, i);
                child = FindElementByName(child, name);
                if (child != null)
                    return child;
            }
    
            return null;
        }
    }

     

    You can see in the LayoutUpdated event handler that I'm grabbing the StackPanel from the legend and then grabbing the first item in the children list.  I then remove it from the list and re-add it at the bottom.  You would then use the behavior like so in your XAML: 

    <ig:Legend>
        <i:Interaction.Behaviors>
            <b:RearrangeLegendItems/>
        </i:Interaction.Behaviors>
    </ig:Legend>

     

    Let me know if you have any questions on this.