Is there any easy way to bind a specific legend color to a data series?

10 posts, 0 answers
  1. Di
    Di avatar
    10 posts
    Member since:
    Aug 2010

    Posted 11 Mar 2011 Link to this post

    Is there any easy way to bind a specific legend color to a data series?
    I got three colors in my data series, which are red, yellow and green. So when I group by color, I have red data series, yellow data series and green data series. Now I need to bind red data series to red color legend, yellow data series to yellow color legend, green to green.

    Sometimes one or two of the three colors do not have any data, so this color is missing. Since I have bind PlatteBrushes in order red, yellow and green, I will get red color to show yellow or green data.

    How can I solve this?

    I am trying to create a drilldown chart now, which made this even harder.

    Thanks a lot.
  2. Sia
    Admin
    Sia avatar
    667 posts

    Posted 16 Mar 2011 Link to this post

    Hello Di,

    The palette brushes functionality exposes a way to set custom colors for RadChart, but it does not keep the relation between a color and series. That is why when you don't have data for one of the series, the colors are changed /seems like the chart palette brushes are reset/.

    However, there are several possible options to control this behavior, which depend on your scenario.

    1. Keep using the PaletteBrushes collection for the control  and when the underlying data is changed, you can add/remove/alter the palette brushes accordingly, in order to preserve the logical correlation between some seriesX and ColorX.

    2. Directly alter the visual attribites of a series mapping:

    Copy Code
    <telerik:RadChart.SeriesMappings>
                   <chart:SeriesMapping>
                       <chart:SeriesMapping.SeriesDefinition>
                           <chart:AreaSeriesDefinition NullValueBehavior="{Binding NulValueBehavior}" ShowItemToolTips="True">
                               <chart:AreaSeriesDefinition.Appearance>
                                   <chart:SeriesAppearanceSettings Foreground="Green" Stroke="Green">                                    
                                   </chart:SeriesAppearanceSettings>
                               </chart:AreaSeriesDefinition.Appearance>
                           </chart:AreaSeriesDefinition>                        
                       </chart:SeriesMapping.SeriesDefinition>
                       <chart:ItemMapping FieldName="Value" DataPointMember="YValue"></chart:ItemMapping>
                       <chart:ItemMapping FieldName="Date" DataPointMember="XValue"></chart:ItemMapping>
                   </chart:SeriesMapping>
               </telerik:RadChart.SeriesMappings>

    3. Check this example also. There you can see how all colors are preserved because when a series is not visible, it is actually hidden.

    Please try some of these approaches according to your scenario and let us know how it goes.

    Greetings,
    Sia
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
  3. DevCraft banner
  4. Di
    Di avatar
    10 posts
    Member since:
    Aug 2010

    Posted 17 Mar 2011 Link to this post

    Hi Sia,

    For the three options you provided:

    #1. I was using this for a chart which is not Drill Down Chart. I check the data source everytime to see if it contains red, yellow and green to decide whether to add the color to PaletteBrushes collection. This worked fine.

    But now I am using a Drill Down Chart, the one just like the "By Age and Region" in your Drill Down Chart Demo, only the "Age" is changed to color. I have only one data series, grouped by Region and Color.

    When I click on one of the data bar in ChartArea1, sometimes it doesn't contain red or yellow. But I didn't find a way to test what color is contained in this step. Do you have more suggestions on this?

    #2. Since I met the error "Object reference not set to an instance of an object." in xaml, I have translated the SeriesMappings code to cs file instead. Now I didn't find the counterpart for attribute AreaSeriesDefinition.

    BTW, I was trying to use the code below according to code in demo xaml file. But this got error every time.
    ChartArea1.SeriesDefinition.InteractivitySettings.SelectionScope = InteractivityScope.Item;
    ChartArea1.SeriesDefinition.InteractivitySettings.SelectionMode = ChartSelectionMode.Single;

    Only code below worked. But this makes the interactivity available to all three chart areas.
    Chart.DefaultSeriesDefinition.InteractivitySettings.SelectionScope = InteractivityScope.Item;
    Chart.DefaultSeriesDefinition.InteractivitySettings.SelectionMode = ChartSelectionMode.Single;

    Do you have any suggestion on this?

    #3. To follow this demo, I have to use three data series for the three colors instead, right?
    And still, I didn't see any code you have bind a specific color for any of the data series. I think I will meet the same problem with option #1. What do you say?
  5. Sia
    Admin
    Sia avatar
    667 posts

    Posted 21 Mar 2011 Link to this post

    Hello Di Yang,

    Attached is a possible solution of your problem where the exposed appearance API is used. Please review it and tell us whether it is appropriate for your scenario and the way your data is structured. If you click the first bar you will see how the colors are preserved despite that there is missing data.

    Greetings,
    Sia
    the Telerik team
  6. Di
    Di avatar
    10 posts
    Member since:
    Aug 2010

    Posted 22 Mar 2011 Link to this post

    Hi Sia,

    I successfully bind three colors with three data series seperately with methods in the demo you provide.

    The problem now is, our Drill Down Chart is connected with a RadGridView and able to show data selected by RadGridView Filter. I didn't find any built-in method to do this, so I read the filter and filtered datasource for Drill Down Chart. This worked fine when I put everything about about SeriesMappings in cs file.

    Now with the xaml code you provide, the Drill Down Chart works fine without filtering. Once I filter anything in RadGridView, Drill Down Chart shows "Loading" forever.

    But I didn't manage to write those code in cs file, as I mentioned before:

    *********************

    BTW, I was trying to use the code below according to code in demo xaml file. But this got error every time.
    ChartArea1.SeriesDefinition.InteractivitySettings.SelectionScope = InteractivityScope.Item;
    ChartArea1.SeriesDefinition.InteractivitySettings.SelectionMode = ChartSelectionMode.Single;

    Only code below worked. But this makes the interactivity available to all three chart areas.
    Chart.DefaultSeriesDefinition.InteractivitySettings.SelectionScope = InteractivityScope.Item;
    Chart.DefaultSeriesDefinition.InteractivitySettings.SelectionMode = ChartSelectionMode.Single;

    *********************

    I met the same error with

    ChartArea1.SeriesDefinition.Appearance.Fill = new SolidColorBrush(Color.FromArgb(255, 200, 200, 0));


    How could I solve this?

    Regards,
    Di
  7. Sia
    Admin
    Sia avatar
    667 posts

    Posted 24 Mar 2011 Link to this post

    Hi Di,

    If you use series mapping as your case is, you need to set your interactivity settings as follows:
    seriesMapping.SeriesDefinition.InteractivitySettings.SelectionScope = InteractivityScope.Item;

    The same is true about the appearance:
    seriesMapping.SeriesDefinition.Appearance.Fill = new SolidColorBrush(Colors.Red);
    seriesMapping.SeriesDefinition.Appearance.Stroke = new SolidColorBrush(Colors.Red);
    seriesMapping.SeriesDefinition.Appearance.PointMark.Stroke = new SolidColorBrush(Colors.Red);

    Regarding the filtering: in this example you can see how the group descriptors from the GridView are applied to the Chart. The same approach should apply for filtering.

    Please send us a sample project so we can give you more adequate advice.

    Kind regards,
    Sia
    the Telerik team
  8. Di
    Di avatar
    10 posts
    Member since:
    Aug 2010

    Posted 24 Mar 2011 Link to this post

    Hi Sia,

    ChartArea1 is my seriesMapping.

    so my code is the same as the one you provide.

    But I met error every time with it and got through once comment it out.

    Do you have any suggestion on this?

    Thanks,
    Di
  9. Sia
    Admin
    Sia avatar
    667 posts

    Posted 30 Mar 2011 Link to this post

    Hi Di,

    Unfortunately it is not possible to give you some specific recommendations without being able to see your code. Please send us a runnable small project reproducing your issue.

    Thank you in advance,
    Sia
    the Telerik team
  10. Sivakumar
    Sivakumar avatar
    2 posts
    Member since:
    Jul 2012

    Posted 04 Aug 2012 Link to this post

    Does zooming and scrolling works for double data?
    Thing is i have tried for double data but i could not make zoom and scroll at x-axis, but same thing tried with date values, it working fine.

    Could you please help me, 
  11. Evgenia
    Admin
    Evgenia avatar
    1407 posts

    Posted 08 Aug 2012 Link to this post

    Hi Sivakumar,

     The zooming and scrolling feature works both with datetime and double data. This is described in our documentation. The onliest restriction is to use the feature in databound scenarios only. 
    Please review the topic. If the problem still persists you may open a formal support thread and send a project where this reproduces for us to further investigate the cause for it.

    All the best,
    Evgenia
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Back to Top
DevCraft banner