Remove Gaps between bars in Bar Series

2 posts, 0 answers
  1. Mangesh
    Mangesh avatar
    2 posts
    Member since:
    Mar 2012

    Posted 06 Mar 2012 Link to this post

    Hi Telerik Team,

    I have a bar series showing static amounts (data points) for 1st to 31st of March. 
    > Can you please suggest how we can remove the gaps between the bars in Bar Series?
    > Can you please also suggest how we can show every Sunday bar with a different color in this series?

    Thanks
  2. Victor
    Admin
    Victor avatar
    1351 posts

    Posted 06 Mar 2012 Link to this post

    Hi Mangesh,

    You can use the CategoricalAxis.GapLength property to set the gap between the bars. For example:

    <telerikChart:CategoricalAxis GapLength="0"/>

    In order to have a different color for the sunday bars you can use a template selector. For example:
    <phone:PhoneApplicationPage.Resources>
        <local:MyTemplateSelector x:Key="selector">
            <local:MyTemplateSelector.DefaultTemplate>
                <DataTemplate>
                    <Rectangle Fill="{StaticResource PhoneForegroundBrush}" />
                </DataTemplate>
            </local:MyTemplateSelector.DefaultTemplate>
             
            <local:MyTemplateSelector.SundayTemplate>
                <DataTemplate>
                    <Rectangle Fill="Green" />
                </DataTemplate>
            </local:MyTemplateSelector.SundayTemplate>
        </local:MyTemplateSelector>
     
    </phone:PhoneApplicationPage.Resources>

    <telerikChart:BarSeries x:Name="barSeries"
                            PointTemplateSelector="{StaticResource selector}"/>

    public class MyTemplateSelector : DataTemplateSelector
    {
        public DataTemplate SundayTemplate
        {
            get;
            set;
        }
     
        public DataTemplate DefaultTemplate
        {
            get;
            set;
        }
     
        public override DataTemplate SelectTemplate(object item, DependencyObject container)
        {
            int dataPointCollectionIndex = (int)item;
            BarSeries series = (BarSeries)container;
            DateTime date = (DateTime)series.DataPoints[dataPointCollectionIndex].Category;
     
            if (date.DayOfWeek == DayOfWeek.Sunday)
            {
                return this.SundayTemplate;
            }
     
            return this.DefaultTemplate;
        }
    }

    Of course the code above assumes that the Category property of your data points is the date associated with the current bar.

    Please have a look at our online documentation for more information.

    Write again if you need further assistance. Regards,
    Victor
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  3. DevCraft banner
Back to Top