在highcharts中格式化日期时间轴?

时间:2015-05-13 05:26:35

标签: datetime highcharts formatting axis-labels

http://jsfiddle.net/LLExL/4537/

Can anyone please help with this date time axis formatting on highcharts. 
I want  Xaxis to show month only once unless the new month begins.
Like 29 April 30 1 May 2 3 4 5 
Any help would be highly appreciated

1 个答案:

答案 0 :(得分:3)

您可以使用 xAxis.labels.formatter 功能准确指定要显示为xAxis标签的内容:

labels: {
    formatter: function() {
        var date = new Date(this.value);
        var month = date.toDateString().substring(4,7);
        var day = date.getDate();

        if(this.isFirst || day == 1)
            return day + '. ' + month;

        return day;
    }
}

这里是DEMO

修改

如果您每个月的第一天没有从 1 开始,您可以改变您的代码:

labels: {
    formatter: function() {
         var dateArray = this.axis.series[0].xData;
         var previousDate = new Date(dateArray[dateArray.indexOf(this.value) - 1]);
         var date = new Date(this.value);
         var month = date.toDateString().substring(4,7);
         var previousMonth = previousDate.toDateString().substring(4,7);
         var day = date.getDate();

         if(this.isFirst || (previousMonth != month))
            return day + '. ' + month;

         return day;
     }
}

通过这种方式,您可以查看上一个点,如果他们的月份不匹配,您可以返回日期和月份。仅此一天。这是DEMO