simple question about labels

2 posts, 0 answers
  1. Kevin
    Kevin avatar
    12 posts
    Member since:
    Oct 2013

    Posted 25 Nov 2013 Link to this post

    hi, I am basically using and editing the code from one of you guy's example at:http://demos.telerik.com/silverlight-old/#Chart/MVVM

    However, when i display my chart, the numbers for the bar chart displays above the bar in a different color, seen in the picture below.  I tried looking through the xaml code for the setter property but have been unable to find it.  Labels also show on the diamond in red, I would like it to match the line color. 

    Can you tell me where it is set and how i can change it to look like the example:

    my xaml code:
        <UserControl.Resources>
            <LinearGradientBrush x:Key="LegendItem1Background" EndPoint="1,1" StartPoint="0,0">
                <GradientStop Color="#FF8EBC00"/>
      
            </LinearGradientBrush>
            <SolidColorBrush x:Key="LegendItem2Background" Color="#FF25A0DA" />
      
            <Style x:Key="CustomStyle" TargetType="charting:Bar">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="charting:Bar">
                            <Canvas>
                                <Rectangle x:Name="PART_DefiningGeometry" 
                                       Height="{TemplateBinding ItemActualHeight}"
                                       Width="{TemplateBinding ItemActualWidth}"
                                       Fill="#FF8EBC00" />
                                <Canvas.RenderTransform>
                                    <ScaleTransform x:Name="PART_AnimationTransform" ScaleY="0" />
                                </Canvas.RenderTransform>
                            </Canvas>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
      
            <Style x:Key="CustomLegendItem" TargetType="charting:ChartLegendItem">
                <Setter Property="Padding" Value="5,0,5,0" />
                <Setter Property="Margin" Value="0,3,0,2" />
                <Setter Property="Template" >
                    <Setter.Value>
                        <ControlTemplate TargetType="charting:ChartLegendItem">
                            <Grid x:Name="PART_MainContainer" Background="{TemplateBinding Background}"
                              HorizontalAlignment="Stretch" VerticalAlignment="Top">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition />
                                </Grid.ColumnDefinitions>
                                <Path x:Name="PART_LegendItemMarker" 
                                 Width="16"
                                 Height="16"
                                 Margin="{TemplateBinding Margin}"
                                 StrokeThickness="{TemplateBinding MarkerStrokeThickness}"
                                 Style="{TemplateBinding ItemStyle}"
                                 Stretch="Fill">
                                    <Path.Data>
                                        <PathGeometry x:Name="PART_ItemMarkerGeometry" />
                                    </Path.Data>
                                </Path>
      
                                <TextBlock x:Name="PART_TextBlock"
                                       Grid.Column="1"
                                       Padding="{TemplateBinding Padding}"
                                       Margin="{TemplateBinding Margin}"
                                       Foreground="{TemplateBinding Foreground}"
                                       Text="{TemplateBinding Label}" />
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </UserControl.Resources>
      
      
        <Grid Width="494">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="514*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
      
            <Border Margin="0,0,114,0"></Border>
      
            <TextBlock Grid.Row="1" x:Name="sourceText" 
                       FontSize="12"
                       Foreground="{Binding ApplicationThemeAwareForeground}" 
                       Text="Customer Pricing Tier: " Margin="0,0,324,0" />
            <TextBlock FontSize="12" Foreground="{Binding ApplicationThemeAwareForeground}" Margin="156,0,154,0" Name="textBlock1" Text="" Grid.Row="1" Height="18" />
            <chart:RadChart x:Name="RadChart1" ItemsSource="{Binding Data}" Width="377" Margin="0,0,114,0">
                <chart:RadChart.SeriesMappings>
                    <charting:SeriesMapping>
                        <charting:SeriesMapping.SeriesDefinition>
                            <charting:BarSeriesDefinition ItemStyle="{StaticResource CustomStyle}" ItemLabelFormat="#Y{0.}">
                                  
                            </charting:BarSeriesDefinition>
                        </charting:SeriesMapping.SeriesDefinition>
                        <charting:ItemMapping FieldName="spotcount" DataPointMember="YValue" />
                        <charting:ItemMapping FieldName="mon" DataPointMember="XCategory" />
                    </charting:SeriesMapping>
                    <charting:SeriesMapping>
                        <charting:SeriesMapping.SeriesDefinition>
                            <charting:LineSeriesDefinition ShowItemLabels="True" AxisName="WorldPopulationAxis">
                                <charting:LineSeriesDefinition.Appearance>
                                    <charting:SeriesAppearanceSettings Stroke="{StaticResource LegendItem2Background}">
                                        <charting:SeriesAppearanceSettings.PointMark>
                                            <charting:PointMarkAppearanceSettings Fill="#FF25A0DA"  Stroke="{StaticResource LegendItem2Background}" Shape="Diamond" />
                                        </charting:SeriesAppearanceSettings.PointMark>
                                    </charting:SeriesAppearanceSettings>
                                </charting:LineSeriesDefinition.Appearance>
                            </charting:LineSeriesDefinition>
                        </charting:SeriesMapping.SeriesDefinition>
                        <charting:ItemMapping FieldName="pecentage" DataPointMember="YValue" />
                        <charting:ItemMapping FieldName="month" DataPointMember="XCategory" />
                    </charting:SeriesMapping>
                </chart:RadChart.SeriesMappings>
                <chart:RadChart.DefaultView>
                    <charting:ChartDefaultView ChartLegendPosition="Bottom">
                        <charting:ChartDefaultView.ChartArea>
                            <charting:ChartArea>
                                <charting:ChartArea.AxisX>
                                    <charting:AxisX MajorTicksVisibility="Visible" />
                                </charting:ChartArea.AxisX>
                                <charting:ChartArea.AxisY>
                                    <charting:AxisY AutoRange="True" MinorTicksVisibility="Collapsed" MajorTicksVisibility="Collapsed" />
                                </charting:ChartArea.AxisY>
                                <charting:ChartArea.AdditionalYAxes>
                                    <charting:AxisY AxisName="WorldPopulationAxis" AutoRange="True" MinValue="0" MaxValue="100" Step="10" MinorTicksVisibility="Collapsed" MajorTicksVisibility="Collapsed" />
                                </charting:ChartArea.AdditionalYAxes>
                            </charting:ChartArea>
                        </charting:ChartDefaultView.ChartArea>
                        <charting:ChartDefaultView.ChartLegend>
                            <charting:ChartLegend UseAutoGeneratedItems="False" BorderThickness="0" Padding="5,0,5,0" Header="">
                                <charting:ChartLegendItem Label="number of quotes (#)" MarkerShape="Square" MarkerFill="{StaticResource LegendItem1Background}" Style="{StaticResource CustomLegendItem}" />
                                <charting:ChartLegendItem Label="Acceptance Percentage (RHS)" MarkerShape="Diamond" MarkerFill="{StaticResource LegendItem2Background}" Style="{StaticResource CustomLegendItem}" />
                            </charting:ChartLegend>
                        </charting:ChartDefaultView.ChartLegend>
                    </charting:ChartDefaultView>
                </chart:RadChart.DefaultView>
            </chart:RadChart>
            <TextBlock FontSize="12" Foreground="{Binding ApplicationThemeAwareForeground}" Height="18" Margin="385,100,0,220" Name="textBlock2" Text="Select CCY:" />
            <ComboBox SelectionChanged="ComboBox1_OnSelectionChanged" Foreground="Black" Height="23" HorizontalAlignment="Left" Margin="384,132,0,0" Name="comboBox1" VerticalAlignment="Top" Width="105" />
        </Grid>
      
    </UserControl>  

     

  2. Petar Marchev
    Admin
    Petar Marchev avatar
    968 posts

    Posted 28 Nov 2013 Link to this post

    Hi Kevin,

    You can use the SeriesItemLabelStyle property of the SeriesDefinition at hand:
    <telerik:BarSeriesDefinition ItemStyle="{StaticResource SolidBrushBarStyle}" SeriesItemLabelStyle="{StaticResource RedLabelStyle}">

    I have attached a small project to demonstrate this.

    Regards,
    Petar Marchev
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for SILVERLIGHT.
    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 >>
  3. DevCraft banner
Back to Top