Mobile-friendly x-Axis Labels

[Justin]

I’ve created the DataViz control and I’ve gotten it pretty much the way I want it.  However, I am unable (don't know how) to use jQuery/JS to change the Labels on
the X-Axis.  I am currently displaying hours 1-24.  I’m using Bootstrap to make your chart(s) more mobile-friendly (if you have a sample of that, other than the one online, it’d be greatly appreciated!).  So when I use Bootstrap [or don’t] and look at it on a mobile emulator, it’s cramming all 24 labels into a tiny little 300pixel spot, and obviously they all overlap.   This is a line chart and I'm using ASP.NET MVC4.  Is there any means to do this, preferably in jQuery or JS?

Thanks!

[T. Tsonev]

Hello,

I don't think there's a way to do this automatically, but you can try setting the categoryAxis.maxDateGroups to a lower value for mobile devices:

    $("#chart").kendoChart({
      categoryAxis: {
        categories: [
          new Date("2014/01/01"),
          new Date("2014/01/02")
        ],
        baseUnit: "hours",
        baseUnitStep: "auto",
        maxDateGroups: 12
      }
    });

-- Live demo --

I hope this helps.

Regards,
T. Tsonev
Telerik