General Chart - Approach

4 posts, 1 answers
  1. Allan
    Allan avatar
    18 posts
    Member since:
    Jan 2013

    Posted 23 Jan 2013 Link to this post

    How do I set the width of a chart?
  2. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2595 posts

    Posted 24 Jan 2013 Link to this post

    Hello Allan,

    You can use CSS and set width to the div element from which the chart is initialized. For example: 
    #chart{
        width: //....px;
    }
    Also, you can specify the width of the ChartArea through the configuration options. Like here: 
    @(Html.Kendo().Chart()
      //....
      .ChartArea(chartArea => chartArea
         .Width(400)
       )
     )

    Kind regards,

    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Allan
    Allan avatar
    18 posts
    Member since:
    Jan 2013

    Posted 24 Jan 2013 Link to this post

    I get the following error:

    CS1061: 'Kendo.Mvc.UI.Fluent.ChartAreaBuilder' does not contain a definition for 'Width' and no extension method 'Width' accepting a first argument of type 'Kendo.Mvc.UI.Fluent.ChartAreaBuilder' could be found (are you missing a using directive or an assembly reference?)

    Line 39:                                 .Title(item.LoginAppName)
    Line 40:                                 .ChartArea(chartArea => chartArea
    Line 41: .Width(100) Line 42:                                     )
    Line 43:                                 .Legend(legend => legend

    I should also mention, the page worked fine without the added width code.
  5. Answer
    Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2595 posts

    Posted 25 Jan 2013 Link to this post

    Hi Allan,

    First of all, let me apologize -> the suggested approach is not correct. Actually, in Kendo UI Chart for ASP.NET MVC setting width to the chartArea via the width configuration option is not supported. In order to get the desired outcome you should use the HtmlAttributes. For example: 
    @(Html.Kendo().Chart()
       //....
       .HtmlAttributes(new { style = "width: //....px;" })
    )
    Once again, please accept my apologies.
     
    Kind regards,
    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top
UI for ASP.NET MVC is VS 2017 Ready