Javascript 如何在 x 轴上获取 highcharts 日期？

How to get highcharts dates in the x axis?

提问by Jeff

Is there a standard way to get dates on the x-axis for Highcharts? Can't find it in their documentation: http://www.highcharts.com/ref/#xAxis--type

有没有标准方法可以在 Highcharts 的 x 轴上获取日期？在他们的文档中找不到它：http: //www.highcharts.com/ref/#xAxis--type

When my time range is large enough, it shows dates. However, when the time range isn't large enough, it just shows hours, like this:

当我的时间范围足够大时，它会显示日期。但是，当时间范围不够大时，它只显示小时，如下所示：

This is less than ideal... if it could show a date and time in this case, that'd be great. Anyone know how?

这不太理想……如果它可以在这种情况下显示日期和时间，那就太好了。有谁知道怎么做？

回答by eolsson

Highcharts will automatically try to find the best format for the current zoom-range. This is done if the xAxis has the type 'datetime'. Next the unit of the current zoom is calculated, it could be one of:

Highcharts 将自动尝试为当前缩放范围寻找最佳格式。如果 xAxis 具有类型，则完成此操作'datetime'。接下来计算当前缩放的单位，它可以是以下之一：

• second
• minute
• hour
• day
• week
• month
• year

• 第二
• 分钟
• 小时
• 日
• 星期
• 月
• 年

This unit is then used find a format for the axis labels. The default patterns are:

然后使用该单位查找轴标签的格式。默认模式是：

second: '%H:%M:%S',
minute: '%H:%M',
hour: '%H:%M',
day: '%e. %b',
week: '%e. %b',
month: '%b \'%y',
year: '%Y'

If you want the day to be part of the "hour"-level labels you should change the dateTimeLabelFormatsoption for that level include %dor %e. These are the available patters:

如果您希望这一天成为“小时”级别标签的一部分，您应该更改该dateTimeLabelFormats级别的选项 include%d或%e。这些是可用的模式：

• %a: Short weekday, like 'Mon'.
• %A: Long weekday, like 'Monday'.
• %d: Two digit day of the month, 01 to 31.
• %e: Day of the month, 1 through 31.
• %b: Short month, like 'Jan'.
• %B: Long month, like 'January'.
• %m: Two digit month number, 01 through 12.
• %y: Two digits year, like 09 for 2009.
• %Y: Four digits year, like 2009.
• %H: Two digits hours in 24h format, 00 through 23.
• %I: Two digits hours in 12h format, 00 through 11.
• %l (Lower case L): Hours in 12h format, 1 through 11.
• %M: Two digits minutes, 00 through 59.
• %p: Upper case AM or PM.
• %P: Lower case AM or PM.
• %S: Two digits seconds, 00 through 59

• %a：短工作日，如“星期一”。
• %A：长工作日，如“星期一”。
• %d：月份中的两位数日期，01 到 31。
• %e：一个月中的第几天，从 1 到 31。
• %b：短月份，如“Jan”。
• %B：长月，如“一月”。
• %m：两位数的月份数字，01 到 12。
• %y：两位数的年份，如 09 代表 2009。
• %Y：四位数年份，如 2009。
• %H：24h 格式的两位数小时，00 到 23。
• %I：12h 格式的两位数小时，00 到 11。
• %l（小写 L）：12h 格式的小时，1 到 11。
• %M：两位数分钟，00 到 59。
• %p：大写 AM 或 PM。
• %P：小写 AM 或 PM。
• %S：两位数秒，00 到 59

http://api.highcharts.com/highcharts#xAxis.dateTimeLabelFormats

http://api.highcharts.com/highcharts#xAxis.dateTimeLabelFormats

回答by Bhesh Gurung

Check this sampleout from the Highcharts API.

从 Highcharts API 中查看此示例。

Replace this

替换这个

return Highcharts.dateFormat('%a %d %b', this.value);

With this

有了这个

return Highcharts.dateFormat('%a %d %b %H:%M:%S', this.value);

Look hereabout the dateFormat()function.

看看这里的dateFormat()功能。

Also see - tickIntervaland pointInterval

另见 - tickInterval和pointInterval

回答by Ronniemittal

You write like this-:

你这样写-：

xAxis: {
        type: 'datetime',
        dateTimeLabelFormats: {
           day: '%d %b %Y'    //ex- 01 Jan 2016
        }
}

also check for other datetime format

还检查其他日期时间格式

http://api.highcharts.com/highcharts#xAxis.dateTimeLabelFormats

http://api.highcharts.com/highcharts#xAxis.dateTimeLabelFormats