最近寫了一些數(shù)據(jù)方面的需求,所以免不了使用echarts,因為沒怎么用過,所以遇到的問題還是比較多,先記錄一些簡單的問題叭。
在顯示一個柱狀圖的時候,x軸的數(shù)據(jù)是隔一個顯示的,但是hover的時候卻能顯示出當前軸x軸的名稱,如下圖:

剛開始有點奇怪,看代碼是沒有任何毛病的,后來就試了官網的例子,也就是把最好一個柱子的x軸名稱改為周天,則顯示就沒毛病了:

那就只能說明這個軸的名稱太長了,所以導致它默認就隔一個顯示,找了半天才發(fā)現(xiàn)控制它的屬性是axisLabel,
xAxis : [
{
type : 'category',
data : ["周一", "周二", "周三", "周四", "周五", "周六", "周天"],
axisTick: {
alignWithLabel: true
},
axisLabel: {
interval:0
}
}
],
該屬性設置成0則表示強制顯示所有標簽,設置為1的話,隔一個標簽顯示一個標簽,以此類推。
但是設置為0的話,如果數(shù)據(jù)再長點,它會把這個數(shù)據(jù)直接不顯示,還是沒有解決問題,后來發(fā)現(xiàn),可以讓這個數(shù)據(jù)傾斜,那么就不會有不顯示的問題了,
axisLabel: {
interval:0,
rotate:45, //代表逆時針旋轉45度
}
rotate表示傾斜顯示,-是順時針旋轉多少度,+或不寫表示逆時針旋轉多少度,默認值為90,那么顯示就如下了:

雖然只是一個小點,但是還是要養(yǎng)成多學習多記錄的習慣,給自己加油!