Bar chart bars are not visible

[Mingxue]

Hi, I am using Bar chart to display some data. But most often, the bars are too small to be visible in the view. Please see attachment.

Is there something I can set so that even though the Y value is small, bar is still visible in the view?

Thanks,

Mingxue

[Mingxue]

Hi, attaching another screenshot since it is happening in another scenario.

[Petar Marchev]

Hello Mingxue,

Needless to say that due to the large range and small value, the height of the bar is calculated (and rounded) to zero. You should be able to work this out by simply setting the DefaultVisualStyle of the BarSeries to a style that has a Setter for the MinHeight.

Additionally, if you have zero-values, you can check on this SDK demo to see how you can implement zero-value indication - DefaultVisualStyleSelector.

Regards,
Petar Marchev
Telerik

[Mingxue]

Thanks, that's what I needed.

[Mingxue]

Sorry, I thought it was fixed, but not yet.

The way I am doing is to write PointTemplate, so that I can use my own color for selected bars like this:

                    <telerik:BarSeries.PointTemplate>
                        <DataTemplate>
                            <Border

                                Style="{StaticResource NonZeroBarStyle}"
                                Background="{Binding DataItem, Converter={StaticResource SliceToBarBrushConverter}}"
                                MouseEnter="BarElement_MouseEnter"
                                MouseLeave="BarElement_MouseLeave" />
                        </DataTemplate>
                    </telerik:BarSeries.PointTemplate>

 

I tried to put a style:

        <Style x:Key="NonZeroBarStyle" TargetType="Border">
            <Setter Property="BorderBrush" Value="Red" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="MinHeight" Value="3" />
        </Style>

 

and use it for the DataPointTemplate like this above.

But it didn't work, my bar is still zero-ed out.

 

[Petar Marchev]

Hello Mingxue,

I think that I just didn't give you enough information initially. The series and axes are put in a Canvas and axes have a higher ZIndex than series, so the axes is drawn on top of the series. Additionally, the series are clipped to the plot area, so essentially what happens is that the 3 pixels bar is clipped to a 1 pixel bar and this single pixel is drawn under the axis.

In order to get it to work, you can set a higher ZIndex for the BarSeries (note that you need the ZIndex property of the series and not the Panel.ZIndex attached property). Set it to a high enough number, I think 500 should suffice. Set the ClipToPlotArea property of the series to false. I suggest you use the style selector to detect if the value of the datapoint is zero and only then pass a special ZeroValueBarStyle. You can then consider displacing the Border a bit upwards (via Margin), so that it does not give the impression that the value is negative. Or you can use another shape, not a Border, but perhaps an Ellipse.

Let us know how it goes.

Regards,
Petar Marchev
Telerik