[英]How to display different tooltip formats in series of data in High Chart
在這里,我有一系列數據,而其中一些數據的持續時間如00:12:00
而其他數據則為int
值,
這是我的Javascript代碼(您也可以在JSFiddle上查看它):
$(function () {
$('#container').highcharts({
chart: {
type: 'line',
inverted: false
},
title: {
text: 'Duration Data'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
min: 0,
type: "datetime",
title: {
text: 'Time Duration'
},
lineWidth: 2,
labels: {
formatter: function () {
var ts = this.value,
hs = ts / (3600 * 1000),
ms = new Date(ts).getUTCMinutes();
sc = new Date(ts).getUTCSeconds();
sc = sc < 10 ? '0' + sc : sc;
ms = ms < 10 ? '0' + ms : ms;
hs = hs < 10 ? '0' + hs : hs;
if(hs > 1)
return hs + ":" + ms +":" + sc;
else
return ms +":" + sc;
}
}
},
tooltip:{
formatter:function() {
return Highcharts.dateFormat('%H:%M:%S',this.y);
}
},
legend: {
enabled: false
},
plotOptions: {
spline: {
marker: {
enable: false
}
}
},
series: [{
name: 'Time',
data: [600000, 2520000,75610000]
},
{
name: 'Price',
data: [12,778,123]
}]
});
});
這是我的HTML代碼:
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
如何區分高圖表中的多個系列數據?
嘗試這個:
tooltip:{
formatter:function() {
var a = Highcharts.dateFormat('%H:%M:%S',this.y);
if(a === "00:00:00"){
return this.y;
}else{
return a;
}
}
}
這是更新的小提琴: http : //jsfiddle.net/ishandemon/efgu7eru/2/
更新了小提琴的系列名稱: http : //jsfiddle.net/ishandemon/efgu7eru/3/
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.