Adjusting embedded chart sizes

2 posts, 0 answers
  1. Chris
    Chris avatar
    13 posts
    Member since:
    Dec 2011

    Posted 08 Sep 2017 Link to this post

    Hello,

    I'm using embedded bar graphs in a grid (telerik:RadHtmlChart) and it will have 1-3 items contained within the graph depending on the row.  Is there some way to adjust the graph (or the row width) to cater for larger or smaller graphs rather than them all being the same size.

    See attached diagram as an example.  I would like the size of the bars in the graph to be standardized regardless of how may items there are.  E.g. in this case have the single item graph be the same width as the 2 item graphs.

    Thanks

  2. Vessy
    Admin
    Vessy avatar
    2062 posts

    Posted 13 Sep 2017 Link to this post

    Hi Chris,

    There is no a direct property for configuring the width of the series of the chart, but you can control it by setting the value to the BarSeries.Gap property:
    http://docs.telerik.com/devtools/aspnet-ajax/controls/htmlchart/appearance-and-styling/gap-and-spacing#gap-and-spacing
    <telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" Transitions="true">
        <PlotArea>
            <Series>
               <telerik:BarSeries Name="Product A" Gap="5">
                    ...
               </telerik:BarSeries>

    Optionally, you can set the Gap of the series in the Chart depending on the series count in the different charts. I hope this approach will be applicable to your scenario.

    Regards,
    Vessy
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top