Thursday, October 6, 2011

Highcharts Month Year X Axis Format

Highcharts is really awesome. If you need to neat looking charts, this is the answer.

I faced a bit problem with setting the X Axis date format to stick with Month-Year format. That is because Highcharts automatically adjust the best possible date range. To maintain the date range to monthly (Month-Year format), is by using tick interval configuration.
To get monthly date range, set the tick interval to approximately one month, so the value is: 31* 24 * 3600 * 1000.

If Highcharts' Licensing does not fit you, then take a look at jqPlot. Not as fancy as Highcharts, but in my opinion it's the best for totally free js charting solution.


  1. or you can just set xAxis categories in format of Month-Year:

  2. Well, I could not use your suggestion since, I needed to have continuous line chart, while there could be empty data on certain date. Therefore, I had to set the tick interval thing.