how to centralize the bars when anybar is not visible ?

[Saravanan]

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

[Peshito]

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

[Saravanan]

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

[Peshito]

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