Jquery Highcharts-在数据标签中将秒更改为时间（H:M:S）

如何更改图表上的值，使其显示为HH:MI:SS而不是秒

$(function () {
        $('#container').highcharts({
            chart: {
                type: 'line'
            },
            title: {
                text: ''
            },
            xAxis: {
                categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
            },
            yAxis: [{
                title: {
                    text: 'Temperature (°C)'
                }
            },{ // Secondary yAxis
                title: {
                    text: 'Rainfall'
                },
                 gridLineWidth: 0,
                    type: 'datetime', //y-axis will be in milliseconds
                    dateTimeLabelFormats: { //force all formats to be hour:minute:second
                        second: '%H:%M:%S',
                        minute: '%H:%M:%S',
                        hour: '%H:%M:%S',
                        day: '%H:%M:%S',
                        week: '%H:%M:%S',
                        month: '%H:%M:%S',
                        year: '%H:%M:%S'
                    },
                opposite: true
            }],
            plotOptions: {
                line: {
                    dataLabels: {
                        enabled: true
                    },
                    enableMouseTracking: false
                }
            },
            series: [{
                name: 'Tokyo',
                yAxis: 1,
                data: [17.0*1000, 16.9*1000, 19.5*1000, 114.5*1000, 118.4*1000, 121.5*1000, 125.2*1000, 126.5*1000, 123.3*1000, 118.3*1000, 113.9*1000, 19.6*1000]
            }, {
                name: 'London',
                data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
            }]
        });
    });

工作示例：

$（函数（）{
$（“#容器”）。高图({
图表：{
类型：“行”
},
标题：{
文本：“”
},
xAxis：{
类别：[一月、二月、三月、四月、五月、六月、七月、八月、九月、十月、十一月、十二月]
},
亚克斯：[{
标题：{
文字：“温度（°C）”
}
}，{//次雅克西
标题：{
文字：“降雨”
},
网格线宽：0，
类型：'datetime'，//y轴将以毫秒为单位
dateTimeLabelFormats:{//强制所有格式为小时：分钟：秒
第二个：“%H:%M:%S”，
分钟：“%H:%M:%S”，
小时数：“%H:%M:%S”，
日期：“%H:%M:%S”，
周：“%H:%M:%S”，
月份：“%H:%M:%S”，
年份：'%H:%M:%S'
},
相反：对
}],
打印选项：{
行：{
数据标签：{
启用：对，
格式化程序：函数（）{
如果（this.series.index==0）{
返回第二次激励计划（本年度/1000）；
}否则{
把这个还给我；
}
}
},
enableMouseTracking:false
}
},
系列：[{
名称:"东京",，
亚克西斯:1,，
数据：[17*1000,16*1000,19*1000,114*1000,118*1000,121*1000,125*1000,126*1000,123*1000,118*1000,113*1000,19*1000]
}, {
名称：“伦敦”，
数据：[3.9,4.2,5.7,8.5,11.9,15.2,17.0,16.6,14.2,10.3,6.6,4.8]
}]
});
});
功能二次激励模式{
var h=Math.floor（s/3600）；//整小时
s-=h*3600；
var m=Math.floor（s/60）；//获取剩余的分钟数
s-=m*60；
返回h+“：”+（m<10？'0'+m:m）+“：”+（s<10？'0'+s:s）；//分秒零填充
}

只需更新此值即可

data: [17.0*1000, 16.9*1000, 19.5*1000, 114.5*1000, 118.4*1000, 121.5*1000, 125.2*1000, 126.5*1000, 123.3*1000, 118.3*1000, 113.9*1000, 19.6*1000]
        }

使用此脚本将整数转换为时间格式

    var seconds = 9999;// multiply by 1000 because Date() requires milliseconds
    var date = new Date(seconds * 1000);
    var hh = date.getUTCHours();
    var mm = date.getUTCMinutes();
    var ss = date.getSeconds();
    // This line gives you 12-hour (not 24) time
    if (hh > 12) {hh = hh - 12;}
    // These lines ensure you have two-digits
    if (hh < 10) {hh = "0"+hh;}
    if (mm < 10) {mm = "0"+mm;}
    if (ss < 10) {ss = "0"+ss;}
    // This formats your string to HH:MM:SS
    var t = hh+":"+mm+":"+ss;
    document.write(t);

---

您可以使用和使用

您不需要创建该函数：

function secondsTimeSpanToHMS(s) { 
    var h = Math.floor(s / 3600); //Get whole hours
    s -= h * 3600;
    var m = Math.floor(s / 60); //Get remaining minutes
    s -= m * 60;
    return h + ":" + (m < 10 ? '0' + m : m) + ":" + (s < 10 ? '0' + s : s); zero padding on minutes and seconds
}

---

简要说明你想做什么。@Hamza，我刚刚更新了我的问题，为什么它不能这样工作？我还可以从db获取H:M:S中的值。它必须是一个数字。OK<但格式化程序仅适用于

plotOptions

，它会更改所有系列。但我只想修改一个。在格式化程序中，您可以通过索引识别您拥有的序列

    var t = 34236; // your seconds
    var time = ('0'+Math.floor(t/3600) % 24).slice(-2)+':'+('0'+Math.floor(t/60)%60).slice(-2)+':'+('0' + t % 60).slice(-2)
    //would output: 09:30:36

function secondsTimeSpanToHMS(s) { 
    var h = Math.floor(s / 3600); //Get whole hours
    s -= h * 3600;
    var m = Math.floor(s / 60); //Get remaining minutes
    s -= m * 60;
    return h + ":" + (m < 10 ? '0' + m : m) + ":" + (s < 10 ? '0' + s : s); zero padding on minutes and seconds
}

return Highcharts.dateFormat('%H:%M:%S', this.y);