Static Bar Size in Bar Series

7 posts, 0 answers
  1. Barry
    Barry avatar
    90 posts
    Member since:
    Jul 2011

    Posted 10 Apr 2013 Link to this post

    I have a bar chart that could have 1 or 100 items in it and I want the bar size to stay the same no matter how many items are on the chart or what level of zoom.

    What is the best way with the zoom/scroll feature to set it up so that the bars stay a consistent size no matter how many and if there are more bars than can fit on the screen the chart area scrolls? No matter what I try it always seems to have different bar sizes or spacing between the bars...

  2. Ves
    Admin
    Ves avatar
    2879 posts

    Posted 15 Apr 2013 Link to this post

    Hi Barry,

    You can use your own rectangle with fixed with:

    <telerik:BarSeries>
        <telerik:BarSeries.PointTemplates>
            <DataTemplate>
                <Rectangle Width="10" Fill="Red"/>
            </DataTemplate>
        </telerik:BarSeries.PointTemplates>


    Kind regards,
    Ves
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. DevCraft banner
  4. Barry
    Barry avatar
    90 posts
    Member since:
    Jul 2011

    Posted 15 Apr 2013 Link to this post

    I've actually already tried that, but there are several problems with that approach...

    - If I set the zoom to 1,1 it makes the bars less than width="110" when there are a lot of items... with no scrolling.

    - If I set the zoom to a level where the bars are width="110" with a lot of items, the zoom becomes incredibly large and unusable when the chart is changed to display only a few items. It also breaks up the cluster, as you can see in the attached screen shot.

    The only thing that I can come up with is to try to create some sort of algorithm that changes the zoom level dynamically depending on the size of the items collection - but how do I figure that out? What a pain! It would be nice to be able to set the width of each item (the whole bar series cluster) so that it remains the same size no matter how many items are in the collection. That way the bar size would stay the same and the cluster would remain tightly packed.

    I don't know why anyone would want a chart that changes its look based on the number of items displayed on the chart. If I were to present this to my boss he would want to know why the bar sizes and spacing between the bars and the horizontal scroll bar keeps changing sizes. He would want me to fix it. A consistent look and feel to something that a user is working with is very important in a UI... this chart does not have consistency.

    All that I want is a bar chart that has the same size bars (in the same size area) no matter how many items the user wants to see on the bar chart. Can this be done with the CartView or Is there another chart that Telerik has that can do this?
  5. Barry
    Barry avatar
    90 posts
    Member since:
    Jul 2011

    Posted 15 Apr 2013 Link to this post

    I updated the attachment...
  6. Ves
    Admin
    Ves avatar
    2879 posts

    Posted 18 Apr 2013 Link to this post

    Hi Barry,

    Actually the measure in this control goes the other way around -- there is some space available for the chart. So, the surrounding axes are placed inside and what's left is used by the chart area i.e. where the series are drawn. Now, if there are 3  categories, the bars will occupy relatively large portions of the space (horizontally) while for 23 categories, each of them will have less space. So, the chart provides each category with the available space. Then, there is a property on the CategoricalAxis -- GapLength. It takes a double number between 0 and 1, and its meaning is the relative part of the space which should not be occupied by bars (0.9 means only 10% of the space will be occupied by bars, while 0 means there are no gaps, so the chart would look like a histogram).

    Now, let's consider the first case in your image. There is simply no room for 23 clusters, 3 bars each, 110 px for each bar. So the chart just displays all the data, but it needs to shrink the bar width in order to fit all the categories. On the other hand -- third case -- the chart has a strictly defined space for each category (based on the available space, zoom and number of categories) and places the bars inside. So, I am afraid my previous suggestion would serve only a limited number of cases. Unfortunately, the scenario you have described is not supported and a possible workaround would be to hook the ZoomChanged event of RadCartesianChart (NB! It is only available in the Latest Internal Build) and calculate your own value for GapLength, so that the bigger the zoom width, the wider gap length gets.

    Best regards,
    Ves
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  7. Valentin
    Valentin avatar
    2 posts
    Member since:
    Jan 2015

    Posted 08 Aug Link to this post

    Hi Barry, 

     

    Did you found any solution for this problem ? Because i'm in the same case and this is very annoying. 

    There is something new on the options for the chart ? 

     

    Best regards, 

    Val

  8. Peshito
    Admin
    Peshito avatar
    497 posts

    Posted 09 Aug Link to this post

    Hello,

    The scenario is not supported out of the box and you should stick to the workaround Ves suggested earlier. Attach to chart's ZoomChanged event and then calculate your own value for GapLength, so that the bigger the zoom width is, the wider gap length gets.

    Regards,
    Peshito
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
Back to Top
DevCraft banner