Auto-rotate category labels?

4 posts, 0 answers
  1. Tieson
    Tieson avatar
    11 posts
    Member since:
    May 2012

    Posted 30 Dec 2014 Link to this post

    I know that Kendo UI doesn't currently provide any way to toggle automatic rotation of category labels (for the line, column, etc. charts that have a category axis). What I'm mostly interested in is some direction on where I should focus my efforts in the source code if I want to try to add this functionality myself. I primarily use the ASP.NET MVC wrappers, but I assume there would be some endpoints I would have to tweak or add to make this work.

    I am aware that I can trim the labels; that unfortunately doesn't always work (nor does it often look all that good for my use-cases). The step option also doesn't get me what I need. I *could* manually calculate a rotation angle if I were binding to data on the server end, but that causes the view in which these charts are used to load somewhat slowly (some of the charts are driven by aggregate data that I don't control).

    By way of example, the Chart.js library already does this: http://www.chartjs.org/docs/#line-chart-introduction (if you set a narrow viewport, you can see the labels rotate).
  2. T. Tsonev
    Admin
    T. Tsonev avatar
    2772 posts

    Posted 02 Jan 2015 Link to this post

    Hello,

    Retrofitting this feature will result in a fragile implementation at best. The infrastructure for it is simply not there.
    My suggestion is to try a simpler approach such as using 90 degree rotation when the chart is too narrow.

    Please file a request for this feature on our UserVoice portal if you have a minute.
    This will help us gauge the overall interest and prioritize.

    Regards,
    T. Tsonev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Tieson
    Tieson avatar
    11 posts
    Member since:
    May 2012

    Posted 03 Jan 2015 in reply to T. Tsonev Link to this post

    Posted to UserVoice, as requested.

    Arbitrarily rotating the labels to 90 degrees doesn't normally result in a very pleasant chart, in my experience. I either wind up with a very tall chart (proportionate to the rest of the page), or the plot area (say, where the columns of a column chart render) gets compressed to accommodate the rotated labels.

    I really just need a way to set the rotation value of the labels on the client side *after* data has been requested, but I haven't yet found any obvious way to do so.

    I would love to be able to do something like:

    <script>
         $(function() {
             var chart = $("#my-chart").data("kendoChart");
     
            /* ... my magic code to calculate required rotation */
     
            chart.CatergoryAxis.setRotation(rotation);
         });
    </script>

  5. T. Tsonev
    Admin
    T. Tsonev avatar
    2772 posts

    Posted 07 Jan 2015 Link to this post

    Hi,

    The dataBound event will be fired when the data is loaded, but before any rendering has commenced.
    Changes to the axis option made at this moment will be applied without further actions, e.g. a call to refresh.

    Thanks for the feedback.

    Regards,
    T. Tsonev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready