最近在使用echarts插件繪制動態折線圖時,發現當折線圖的一個數值較高點緊挨着一個數值為零的點,圖形會被拉扯,如圖
網上查閱資料([https://blog.csdn.net/JsongNeu/article/details/89204002])可通過對data數組的值加0.01,然后在tooltip的顯示值中減0.01 來進行處理。資料中沒說怎么修改tooltip,因此到官網上找了個案例,嘗試修改案例的tooltip。 原來的tooltip
tooltip: { trigger: 'axis' }
原來的顯示框:
修改后的tooltip:
tooltip: {
trigger: 'axis',
formatter: function (params, ticket, callback) {
var showHtm="";
showHtm = params[0].axisValue + '';
for(i=0;i<params.length;i++){
if(i % 2 == 0){
if(params[i].value > 100){
showHtm += params[i].marker + params[i].seriesName + ':' + params[i].value + ' ' ;
}else{
showHtm += params[i].marker + params[i].seriesName + ':' + params[i].value + '   ' ;
}
}else{ showHtm += params[i].marker + params[i].seriesName + ':' + params[i].value+ '';
}
}
return showHtm;
}
}
參數params[0].axisValue:獲取對應x軸的值;
參數params[i].marker:在每個顯示值前添加不同顏色的圓圈,區分每條折線;
參數params[i].seriesName:獲取每條折線的名稱;
參數params[i].value:獲取每條折線的值;
修改后的顯示框: