How to customer different colors of series labels foreground.

2 posts, 0 answers
  1. Jun
    Jun avatar
    3 posts
    Member since:
    Dec 2013

    Posted 20 Jan 2014 Link to this post

    I used RadChart of Bar Series..
    I want to display different Series Label Text Foreground Color from own's Bar Color with transparent background.
    How can I solve this... please advice to me...

    attached files are before and after screen.

    bellow code is source
    <chart:RadChart Grid.Row="0"
                                                    ItemsSource="{Binding DFChartList}"
                                                    SeriesMappings="{Binding DFSeriesMappings2}"
                                                    LegendStyle="{StaticResource ChartLegendStyle}"
                                                    MinWidth="350" MinHeight="0" Height="240">
                                            <charting:ChartDefaultView ChartLegendPosition="Bottom">
                                                    <charting:ChartArea LegendName="ChartLegend1" EnableAnimations="False" EnableTransitionAnimations="True"
                                                                        TransitionControlStyle="{StaticResource TransitionControlStyle}" LabelFormatBehavior="None">
                                                            <charting:AxisY AutoRange="False" MinValue="0" MaxValue="{Binding DFMaxValue}" Step="{Binding DFStepValue}"
                                                                               MinorTicksVisibility="Visible" MajorTicksVisibility="Visible" />
                                                    <charting:ChartLegend BorderThickness="0" Header="" x:Name="ChartLegend1" />
    XElement rootElement = e.Result;

                    foreach (XElement rowEle in rootElement.Descendants("row"))
                        String strCreateDate = rowEle.Attribute("createDate") != null ? rowEle.Attribute("createDate").Value : String.Empty;
                        DateTime dtCreateDate = new DateTime();
                        DateTime.TryParse(strCreateDate, out dtCreateDate);
                        strCreateDate = dtCreateDate.ToString("MM/dd");

                        ChartM StatAPIAnalChartM = new ChartM();
                        StatAPIAnalChartM.CreateDate = strCreateDate;
                        StatAPIAnalChartM.Type = "StaticAPIanalysis";
                        StatAPIAnalChartM.Count = 0;
                        StatAPIAnalChartM.ChartColor = new SolidColorBrush(Color.FromArgb(255, 106, 228, 92));

                        ChartM AppContReviewChartM = new ChartM();
                        AppContReviewChartM.CreateDate = strCreateDate;
                        AppContReviewChartM.Type = "Appl.ContentReview";
                        AppContReviewChartM.Count = 0;
                        AppContReviewChartM.ChartColor = new SolidColorBrush(Color.FromArgb(255, 119, 158, 232));

                        ChartM DynAPIAnalChartM = new ChartM();
                        DynAPIAnalChartM.CreateDate = strCreateDate;
                        DynAPIAnalChartM.Type = "DynamicAPIanalysis";
                        DynAPIAnalChartM.Count = 0;
                        DynAPIAnalChartM.ChartColor = new SolidColorBrush(Color.FromArgb(255, 242, 84, 144));

                        ChartM OthersChartM = new ChartM();
                        OthersChartM.CreateDate = strCreateDate;
                        OthersChartM.Type = "Others";
                        OthersChartM.Count = 0;
                        OthersChartM.ChartColor = new SolidColorBrush(Color.FromArgb(255, 148, 0, 211));

                        ChartM FncTestChartM = new ChartM();
                        FncTestChartM.CreateDate = strCreateDate;
                        FncTestChartM.Type = "FunctionalTest";
                        FncTestChartM.Count = 0;
                        FncTestChartM.ChartColor = new SolidColorBrush(Color.FromArgb(255, 170, 128, 0));



    public void BindDFChart()
                Style itemLabelStyle1 = new Style { TargetType = typeof(SeriesItemLabel) };
                itemLabelStyle1.Setters.Add(new Setter(SeriesItemLabel.ForegroundProperty, new SolidColorBrush(Color.FromArgb(255, 106, 228, 92))));
                itemLabelStyle1.Setters.Add(new Setter(SeriesItemLabel.FontWeightProperty, FontWeights.Bold));
                itemLabelStyle1.Setters.Add(new Setter { Property = SeriesItemLabel.FontWeightProperty, Value = FontWeights.Bold });
                itemLabelStyle1.Setters.Add(new Setter { Property = SeriesItemLabel.FillProperty, Value = new SolidColorBrush(Colors.Transparent) });

                BarSeriesDefinition definition1 = new BarSeriesDefinition();
                definition1.ShowItemToolTips = true;
                definition1.ShowItemLabels = true;
                definition1.LabelSettings.LabelDisplayMode = LabelDisplayMode.Outside;
                definition1.SeriesItemLabelStyle = itemLabelStyle1;

                SeriesMapping mapping1 = new SeriesMapping();
                mapping1.SeriesDefinition = definition1;
                mapping1.GroupingSettings.GroupDescriptors.Add(new ChartGroupDescriptor("Type"));
                mapping1.ItemMappings.Add(new ItemMapping("Count", DataPointMember.YValue));
                mapping1.ItemMappings.Add(new ItemMapping("CreateDate", DataPointMember.XCategory));


                SeriesMappingCollection mappings = new SeriesMappingCollection();
                this.DFSeriesMappings2 = mappings;

  2. Evgenia
    Evgenia avatar
    1437 posts

    Posted 24 Jan 2014 Link to this post

    Hello Jun,

    In the attached project I have replaced the Appearance API setters in the code behind with a declaration of StyleBuilderData object instance that holds the necessary colors and mappings in the UserControl.Resources (the key should be "StyleBuilderData" so the control can pick the correct resource up). If you use only line series definitions in your application, you can remove all commented lines, because they are necessary for other series. 

    The main idea is that most of our themes [except the Expression Dark one] have White fill for the point marks, that cannot be changed through the PaletteBrushes functionality. That is why in the styles that overwrite the default ones I have changed the PointMarkStyle to use the main color for its fill: 

    <telerik:StyleMappingCollection x:Key="PointMarkStyle">
        <telerik:StyleMapping Property="Stroke" SourceKey="main" />
        <telerik:StyleMapping Property="Fill" SourceKey="main" />

    The main color is the one that can be modified  when using a custom palette.

    I hope this helps.

    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
Back to Top