how to centralize the bars when anybar is not visible ?

4 posts, 0 answers
  1. Saravanan
    Saravanan avatar
    36 posts
    Member since:
    Jun 2011

    Posted 14 Jul 2011 Link to this post

    Hi,
    i have radchat  with 4 bars if any bar has zero value then bar will not be visible,,its ok ,
     
    but i want to rearrange the all bars in central..how should i do this ?
     
    also,how to change background color of legend area please let me know here i have attached screen for your reference..
      
    her is my code,
     
    In Xaml File..
     < <Style x:Key="MyBarStyle" TargetType="chart:Bar">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="chart:Bar">
     
                            <Canvas Opacity="0"
                                    x:Name="PART_MainContainer">
                                <Rectangle
                                        x:Name="PART_DefiningGeometry"
                                        Height="{TemplateBinding ItemActualHeight}"
                                        Width="{TemplateBinding ItemActualWidth}"
                                        Style="{TemplateBinding ItemStyle}" />
                                <Rectangle
                                        Height="{TemplateBinding ItemActualHeight}"
                                        Width="{TemplateBinding ItemActualWidth}"
                                        Fill="{StaticResource BarMaskBrush}" />
                                <Rectangle
                                        x:Name="PART_SelectedState"
                                        Height="{TemplateBinding ItemActualHeight}"
                                        Width="{TemplateBinding ItemActualWidth}" />
                                <Canvas.RenderTransform>
                                    <ScaleTransform
                                            x:Name="PART_AnimationTransform"
                                            ScaleY="0" />
                                </Canvas.RenderTransform>
                            </Canvas>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </UserControl.Resources>
        <Grid x:Name="LayoutRoot" Background="White">
            <telerik:RadChart x:Name="RadChart1"
                    BorderThickness="0"
                    PaletteBrushesRepeat="True" Width="200">
                <telerik:RadChart.PaletteBrushes>
                    <SolidColorBrush Color="#FF01a0db" />
                    <SolidColorBrush Color=" #FF619d3a" />
                    <SolidColorBrush Color="#FFc2ae30" />
                    <SolidColorBrush Color="#FFbf2e29" />
                </telerik:RadChart.PaletteBrushes>
            </telerik:RadChart>
        </Grid>
     
    In Code behind file
     
    in page load
    RadChart1.ItemsSource = new double[] { 0, 4, 5, 9 };
     
    Thanks,
    Saravanan
  2. Peshito
    Admin
    Peshito avatar
    585 posts

    Posted 19 Jul 2011 Link to this post

    Hello Saravanan,

    Thanks for contacting us.

    Here is how you can change you chart's legend background color in:
    Code behind:
    RadChart1.DefaultView.ChartLegend.Background = new SolidColorBrush(Colors.Brown);

    Declaratively:
    <telerik:RadChart.DefaultView>
                    <telerik:ChartDefaultView>
                        <telerik:ChartDefaultView.ChartLegend>
                            <telerik:ChartLegend Background="#FF0086B8" />
                        </telerik:ChartDefaultView.ChartLegend>
                    </telerik:ChartDefaultView>
    </telerik:RadChart.DefaultView>


    In order to rearrange your bars and hide the empty value bar, you could use this approach in:
    Code behind:
    ChartFilterDescriptor descriptor = new ChartFilterDescriptor();
                descriptor.Operator = FilterOperator.IsGreaterThan;
                descriptor.Value = 0;
                this.RadChart1.FilterDescriptors.Add(descriptor);


    Declaratively:
    <telerikChart:RadChart.FilterDescriptors>
           <telerikCharting:ChartFilterDescriptor
                                                  Operator="IsGreaterThan"
                                                  Value="0" />
       </telerikChart:RadChart.FilterDescriptors>

    More information about descriptors can be found here.

    Changing the legend's position can be achieved like this in:
    Code behind:
    RadChart1.DefaultView.ChartLegendPosition = Dock.Left;

    Declaratively:
    <telerik:RadChart.DefaultView>
                    <telerik:ChartDefaultView ChartLegendPosition="Left">
                        <telerik:ChartDefaultView.ChartLegend>
                            <telerik:ChartLegend Background="#FF0086B8" />
                        </telerik:ChartDefaultView.ChartLegend>
                    </telerik:ChartDefaultView>
    </telerik:RadChart.DefaultView>

    You are also able to change the chart's direction like this:
    Code behind:
    RadChart1.FlowDirection = System.Windows.FlowDirection.RightToLeft;

    Declaratively:
    <telerik:RadChart x:Name="RadChart1" FlowDirection="RightToLeft">

    Hope that helps.

    Regards,
    Peshito
    the Telerik team

    Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

  3. Saravanan
    Saravanan avatar
    36 posts
    Member since:
    Jun 2011

    Posted 19 Jul 2011 Link to this post

    Thank you very much sir for your answer Sir,but the colour of Each bar is vary,
      
    i have to show 4 different bars with 4 different colour(blue,green,yellow,red),i acheived this by applying by
      
     <telerik:RadChart x:Name="RadChart1" BorderThickness="0"
                    PaletteBrushesRepeat="True" Background="#FF1E212A"
                    AxisElementBrush="#FF1E212A" AxisForeground="#FF1E212A"
                    BorderBrush="#FF1E212A">
                       <telerik:RadChart.FilterDescriptors>
                    <chart:ChartFilterDescriptor Operator="IsGreaterThan" Value="0"></chart:ChartFilterDescriptor>
                </telerik:RadChart.FilterDescriptors>
                <telerik:RadChart.DefaultView>
                    <chart:ChartDefaultView>
                        <chart:ChartDefaultView.ChartLegend>
                            <chart:ChartLegend Background="SandyBrown"></chart:ChartLegend>
                        </chart:ChartDefaultView.ChartLegend>
                        <chart:ChartDefaultView.ChartArea>
                            <chart:ChartArea PaletteBrushesRepeat="False">
                                <chart:ChartArea.PaletteBrushes>
                                    <SolidColorBrush Color="Blue" />
                                    <SolidColorBrush Color="Green" />
                                    <SolidColorBrush Color="Yellow" />
                                    <SolidColorBrush Color="Red" />
                                </chart:ChartArea.PaletteBrushes>                                  
                                
                            </chart:ChartArea>
                        </chart:ChartDefaultView.ChartArea>
                    </chart:ChartDefaultView>
                </telerik:RadChart.DefaultView>
      </telerik:RadChart>
      
    In My Code Behind..
      
    RadChart1.ItemsSource = new double[] { 0, 4, 6, 8 }; //0-is blue,4- is green,6-yellow,8-red
    //here i can see the blue colour bar,but i cant' see the red colour red bar,i have to hide the blue colour
    because the value of blue colour is zero
    here i have attached screen for your reference.i want to do like this can u please give me some idea
      
    Thanking you,
    Saravanan
  4. Peshito
    Admin
    Peshito avatar
    585 posts

    Posted 21 Jul 2011 Link to this post

    Hello Saravanan,

    The red color is not displayed because when the zero bar is hidden, the colors are arranged based on the bars available. Using filter descriptor in order to center the bars and hide the zero value ones, draws only those bars who has values greater than zero.Therefore you have three bar items using the first three colors(blue, green, yellow) and there is no bar for the red one.

    According to your requirements and the code you've provided, you could try changing the order of your PalleteBrushes items to:
    <telerik:ChartArea.PaletteBrushes>
                                    <SolidColorBrush Color="Green" />
                                    <SolidColorBrush Color="Yellow" />
                                    <SolidColorBrush Color="Red" />
                                    <SolidColorBrush Color="Blue" />
    </telerik:ChartArea.PaletteBrushes>

    Regards,
    Peshito
    the Telerik team

    Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

Back to Top