How to set size and/or resize a kendo chart ?

11 posts, 0 answers
  1. Thierry
    Thierry avatar
    6 posts
    Member since:
    Jan 2012

    Posted 03 Feb 2012 Link to this post

    Hello,
    I tryed to set the size of the chart through the parent div, but it seems that there is no result.. Size doesn't follow my values.
    Is there a correct way to do that ?
    Thanks in advance

    PS : excuse me for my bad english..
  2. Daniel
    Admin
    Daniel avatar
    2230 posts

    Posted 06 Feb 2012 Link to this post

    Hello Thierry,

    The size of the Chart can be set initially either in the configuration or by specifying the size on the parent element. For example:
    $("#chart").kendoChart({
        chartArea: {
            width: 200,
            height: 200
        },
        ....
    If you wish to change the size dynamically, you should also repaint the Chart by using the refresh or redraw methods after the change.


    All the best,
    Daniel
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Thierry
    Thierry avatar
    6 posts
    Member since:
    Jan 2012

    Posted 06 Feb 2012 Link to this post

    Thank you Daniel.
    last week, i'd finally use the styles for the div, and it works. My precedent try was with the width and height attributes on the div, which are not valid for a div.. I learn ;-)
    I will use your solution, this is more clean.
  4. Alexander
    Alexander avatar
    3 posts
    Member since:
    Feb 2012

    Posted 27 Nov 2012 Link to this post

    Hello, is it possible to do the same with ASP.NET MVC Kendo UI control?
  5. Alexander
    Alexander avatar
    3 posts
    Member since:
    Feb 2012

    Posted 27 Nov 2012 Link to this post

    Hello, is it possible to do the same with ASP.NET MVC Kendo UI control?
  6. Alexander
    Alexander avatar
    3 posts
    Member since:
    Feb 2012

    Posted 27 Nov 2012 Link to this post

    Found it.
    It can be done with css styles.

        <style>
            .k-chart {
                height280px;
                width390px;
            }
        </style>
    
  7. Laura
    Laura avatar
    1 posts
    Member since:
    Nov 2012

    Posted 17 Jan 2013 Link to this post

    Is it possible to set the width of the chart as a %?

    I'm trying to display three charts in a row to fill the screen no matter what size the window is. 

    Any suggestions?

    Thanks,

    Laura
  8. Daniel
    Admin
    Daniel avatar
    2230 posts

    Posted 22 Jan 2013 Link to this post

    Hello Laura,

    It is possible to set the width in percentages on the parent or on the wrapper element but the Chart does not resize automatically. You could use the window resize event and redraw the charts using the redraw method.

    Regards,
    Daniel
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  9. Ming
    Ming avatar
    1 posts
    Member since:
    Mar 2015

    Posted 18 Mar 2015 Link to this post

    Hi, when I use the chartarea to define the size of the box, the legend of the chart doesn't show fully (only half). Do you encounter the same issue? Thanks.
  10. Daniel
    Admin
    Daniel avatar
    2230 posts

    Posted 23 Mar 2015 Link to this post

    Hello Ming,

    The entire legend will not be shown if the size set with the configuration is not sufficient. If the size is sufficient be the legend is incorrectly positioned when using the chartArea configuration then please provide a runnable sample so I can investigate further.

    Regards,
    Daniel
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  11. TISAL
    TISAL avatar
    8 posts
    Member since:
    Dec 2013

    Posted 07 May 2015 in reply to Alexander Link to this post

    Thanks Alexander!
Back to Top