如何更改图表上的值以将其显示为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]
}]
});
});
工作示例: http : //jsfiddle.net/9UGJc/3/
$(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,
formatter: function(){
if( this.series.index == 0 ) {
return secondsTimeSpanToHMS(this.y/1000) ;
} else {
return this.y;
}
}
},
enableMouseTracking: false
}
},
series: [{
name: 'Tokyo',
yAxis: 1,
data: [17*1000, 16*1000, 19*1000, 114*1000, 118*1000, 121*1000, 125*1000, 126*1000, 123*1000, 118*1000, 113*1000, 19*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]
}]
});
});
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
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句