在利用echarts圖形展示數據的時辰 ， x坐標軸的文字 ， 有時辰因為太多了 ， 顯示不完整 ， 有時辰可能又比力少 ， 需要全數顯示 。 那么 ， 到底該若何設置echarts圖形的橫坐標距離呢？其實 ， 重點就在于interval的值
需要這些哦
echarts
方式/
1打開echarts官方實例頁面 ， 點擊第一個折線圖 ， 進行演示
2進入頁面后 ， 可以看到數據比力少 ， 所以橫坐標文字全數都顯示出來了
3點竄左側的option內容 ， 在xAxis的data數組中再添加兩行內容 ， 同時 ， 在series中添加對應數目的值
4運行后 ， 可以看到x橫坐標已經按照圖形大小 ， 主動距離顯示了文字 。 若是沒有特別要求 ， 這個就可以知足當內容少時 ， 全數顯示橫坐標文字 ， 當內容多時 ， 主動距離顯示文字
5【echarts圖形的x橫坐標文字如何設置間隔顯示】在option的xAxis區域添加axisLabel:{interval:0} ， 這個語句的意思是 ， 設置橫坐標的文字全數顯示 ， 不距離
6再次運行就可以看到橫坐標的內容全數顯示了 ， 可是因為空間不敷 ， 內容都擠到一路去了
7將距離值點竄為5 ， axisLabel:{interval:5} ， 再次運行 ， 就可以看到x橫坐標內容已經按照要求距離顯示了
以上內容就是echarts圖形的x橫坐標文字如何設置間隔顯示的內容啦 ， 希望對你有所幫助哦！
猜你喜歡
- 南路茶有哪些功能？，安徽茶文化
- 為貓咪拍照的六個小妙招
- 貓咪所創造的驚人世界紀錄
- 棗茶的功效，大麥茶有什么功效
- 苦蕎為什么富含保健功效？
- 香櫞茶功效，斗茶歌
- 盆栽無花果圖片：讓您對無花果有更多的認識
- 橡皮樹修剪：整形修剪原理圖文
- 一年栽無花果主要剪修方法及配圖
- 盆栽無花果怎么修剪？盆栽無花果修剪方法圖解