echarts圖形的x橫坐標文字如何設置間隔顯示
在利用echarts圖形展示數據的時辰，x坐標軸的文字，有時辰因為太多了，顯示不完整，有時辰可能又比力少，需要全數顯示。那么，到底該若何設置echarts圖形的橫坐標距離呢？其實，重點就在于interval的值
東西/原料
- echarts
方式/步調
- 1
打開echarts官方實例頁面，點擊第一個折線圖，進行演示
- 2
進入頁面后，可以看到數據比力少，所以橫坐標文字全數都顯示出來了
- 3
點竄左側的option內容，在xAxis的data數組中再添加兩行內容，同時，在series中添加對應數目的值
- 4
運行后，可以看到x橫坐標已經按照圖形巨細，主動距離顯示了文字。若是沒有特別要求，這個就可以知足當內容少時，全數顯示橫坐標文字，當內容多時，主動距離顯示文字
- 5
在option的xAxis區域添加axisLabel:{interval:0}，這個語句的意思是，設置橫坐標的文字全數顯示，不距離
- 6
再次運行就可以看到橫坐標的內容全數顯示了，可是因為空間不敷，內容都擠到一路去了
- 7
將距離值點竄為5，axisLabel:{interval:5}，再次運行，就可以看到x橫坐標內容已經按照要求距離顯示了
- 發表于 2019-03-28 22:01
- 閱讀 ( 4483 )
- 分類：其他類型
admin
0 篇文章
作家榜 ?
-
xiaonan123
189 文章
-
湯依妹兒
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
華志健
23 文章