1.自定义提示内容
tooltip提示框中有formatter内容格式器:{string}(Template) | {Function},支持异步回调,因trigger设置为axis所以回调有多个对象
tooltip : {
trigger: 'axis',
formatter: function (params){ //自定义提示框
var startTime = params[0].name;
var endTime = null;
var time = parseInt(params[0].name.split(':')[0]);
if(time == 23){
endTime = '00:00';
} else {
time = time + 1;
endTime = time > 9? `${time}:00` : `0${time}:00`;
}
var htmlStr ='<div>';
htmlStr += startTime + '~' + endTime + '<br/>';//x轴的名称
// //为了保证和原来的效果一样,这里自己实现了一个点的效果
for (var i = 0; i < params.length; i++){
htmlStr += '<span style="margin-right:5px;display:inline-block;width:10px;height:10px;border-radius:5px;background-color:'+params[i].color+';"></span>' + params[i].seriesName + ':'+params[i].value + '<br/>';
}
htmlStr += '</div>';
return htmlStr;
}
},