Issue setting the z-index of an item in a multi-series chart

5 posts, 1 answers
  1. Ruby Jean
    Ruby Jean avatar
    9 posts
    Member since:
    Jun 2012

    Posted 15 Nov 2012 Link to this post

    Hi,

    I have a multi-series chart that when an item is clicked from any of that series, that item will be brought forward. I followed the sample in this URL (http://www.telerik.com/help/silverlight/radchart-howto-control-the-series_items-overlapping-via-zindex-property.html) in setting the item Z-index but nothing happened. Also, instead of using the ChartArea_SelectionChanged, as in the example, I used it on ChartArea_ItemClick. 
     

    Here’s my sample code:

    void ChartArea_ItemClick(object sender, ChartItemClickEventArgs e)
            {           
                var pointMarks = RadChart.DefaultView.ChartArea.ChildrenOfType<PointMark>().ToList<PointMark>();
                var rangeBars = RadChart.DefaultView.ChartArea.ChildrenOfType<RangeBar>().ToList<RangeBar>();
     
                foreach (PointMark pointMark in pointMarks)           
                    pointMark.ClearValue(Canvas.ZIndexProperty);
     
                foreach (RangeBar rangeBar in rangeBars)
                    rangeBar.ClearValue(Canvas.ZIndexProperty);
     
                PointMark selectedPointMark = pointMarks.Where(x => x.DataContext == e.DataPoint).SingleOrDefault();
                RangeBar selectedRangeBar = rangeBars.Where(x => x.DataContext == e.DataPoint).SingleOrDefault();
     
                if (selectedPointMark != null)
                {
                    Canvas.SetZIndex(selectedPointMark, 1000);
                }
                else if (selectedRangeBar != null)
                {
                    Canvas.SetZIndex(selectedRangeBar, 1000);   
                }
            }


    Did I miss anything here? Thanks in advance for the help.  

    Cheers,

    Byang Fernando

  2.
  3. Petar Marchev
    Admin
    Petar Marchev avatar
    1029 posts

    Posted 16 Nov 2012 Link to this post

    Hello Byang,

    The name of the topic (the link you have provided) is "Control the Series Items overlapping via ZIndex property". It describes how to avoid (control) items overlapping, for items in one series. You can not achieve the scenario you describe because the items of one series reside in one panel and the items of another series reside in another panel. The ZIndex is only valid for elements in the same panel.

    May be you can use the Opacity of the items instead:
    void ChartArea_ItemClick(object sender, ChartItemClickEventArgs e)
    {
     var pointMarks = RadChart.DefaultView.ChartArea.ChildrenOfType<PointMark>().ToList<PointMark>();
     var rangeBars = RadChart.DefaultView.ChartArea.ChildrenOfType<RangeBar>().ToList<RangeBar>();
     
     foreach (PointMark pointMark in pointMarks)
      pointMark.Opacity = 0.5;
     
     foreach (RangeBar rangeBar in rangeBars)
      rangeBar.Opacity = 0.5;
     
     PointMark selectedPointMark = pointMarks.Where(x => x.DataContext == e.DataPoint).SingleOrDefault();
     RangeBar selectedRangeBar = rangeBars.Where(x => x.DataContext == e.DataPoint).SingleOrDefault();
     
     if (selectedPointMark != null)
      selectedPointMark.Opacity = 1;
     else if (selectedRangeBar != null)
      selectedRangeBar.Opacity = 1;
    }
     
    All the best,
    Petar Marchev
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  5. Ruby Jean
    Ruby Jean avatar
    9 posts
    Member since:
    Jun 2012

    Posted 16 Nov 2012 Link to this post

    Thanks for the quick response and the work around provided however the requirement is strictly for the item to be brought forward.

    From the reply you mentioned that each series reside in one panel. Is it possible then to set the ZIndex of that panel? So, instead of only one item from the series to be brought forward, the entire items of the series will be brought forward. I actually tried doing this by getting all the LinearSeriesPanel and BarSeriesPanel associated in each series and then I set their ZIndex appropriately however, nothing happened. If I can do this then I can set the ZIndex of the item I want to be brought forward, similar to the sample provided.

    Any help is much appreciated. 

    Thanks,
    Byang Fernando
  7. Answer
    Petar Marchev
    Admin
    Petar Marchev avatar
    1029 posts

    Posted 16 Nov 2012 Link to this post

    Hi Byang,

    Setting the ZIndex to the BarSeriesPanel did not work because of the same reason. The BarSeriesPanel resides in a panel (Series). I have attached a snapshot of a project's visual tree for you to see. You might find the parent (of type Series) of the selected item and set its ZIndex (say 2000). This should work:
    var series = selectedRangeBar.ParentOfType<Series>();
    Canvas.SetZIndex(series, 1234);

    All the best,
    Petar Marchev
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  8.
  9. Ruby Jean
    Ruby Jean avatar
    9 posts
    Member since:
    Jun 2012

    Posted 16 Nov 2012 Link to this post

    That works like a charm! Couldn't be much happier. Thanks so much!

    Cheers,
    Byang Fernando
Back to Top