使用Highcharts在x轴上显示小时和分钟

我想在面积图中输出以下数据（时间、电池电量）：

data: [
    [08.15, 14.8],
    [08.20, 13.9],
    [08.25, 12.8],
    [08.30, 11.8],
    [08.35, 13.9],
    [08.40, 14.1],
    [08.45, 13.9],
    [08.50, 14],
    [08.55, 14],
    [09.00, 14.1],
    [09.05, 14.4]
]

x轴应在一整天的上午00点到下午00点开始

不幸的是，当我查看API时，我不知道要使用哪些选项。 我现在得到的是一个x轴，从8.00~8.55,8.60,8.65~9.00。所以它使用十进制而不是分钟制

如何配置生产线应包括24小时60分钟

根据当前数据，图表将有点空，只有上午8点到9点左右的点

我希望有人能在路上帮我

谢谢

---

Mattijs

Highcharts有一种内置的方式，可以将时间或日期绘制为X轴。通常，在这种情况下，数据将使用以毫秒为单位的时间值，highcharts将相应地绘制它（）

如果您希望一天24小时都包含数据，它可能会如下所示：

var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container'
    },
    xAxis: {
        type: 'datetime' //ensures that xAxis is treated as datetime values
    },

    series: [{
        data: [
            [Date.UTC(2012, 5, 22, 8, 15), 14.8], 
            [Date.UTC(2012, 5, 22, 8, 20), 13.9], 
            [Date.UTC(2012, 5, 22, 8, 25), 12.8]
            //and so on...
        ]
    }]
});

---

然后，您可以执行一些操作，如使用自定义标签或根据需要显示标签。

您可以尝试使用此代码以12小时时间格式制作x轴

xAxis: {
    title: {
        enabled: true,
        text: 'Hours of the Day'
    },
    type: 'datetime',

    dateTimeLabelFormats : {
        hour: '%I %p',
        minute: '%I:%M %p'
    }
},

对于“工具提示”，请尝试以下操作：

tooltip: {
    formatter: function() {
        return ''+
                "" +
                'Time: '+ Highcharts.dateFormat('%I:%M %p', this.x);
    }
},

当然，这个系列将是：

series: [{
        data: [
            [Date.UTC(2013, 3, 22, 1, 15), 12.7], 
            [Date.UTC(2012, 3, 24, 3, 20), 13.5], 
            [Date.UTC(2012, 2, 22, 2, 25), 18.8]
        ]
    }]

---

希望它能解决你的问题。谢谢。

您的x轴值是多少？你想让他们从午夜到午夜，但只想在8:15到9:05之间播放？嘿，马特，你找到解决方案了吗？因为我正在尝试实现sameThank you for you答案，我将尝试将其付诸实践。遗憾的是，当日期完全不同时（即数据数组样本之间的年、月或日发生变化时），提供的解决方案不起作用。有人知道我如何传递不同的日期，并在x轴上绘制时间吗？我尝试过使用DateTimeLabelFormat和Highcharts.dateFormat进行格式化，但都不起作用。提前谢谢！最后的链接已经失效。