ECharts x軸橫座標文字顯示不全(傾斜處理)

ECharts橫座標文字傾斜,有的時候因爲X軸的座標文字較長,無法水平展示,又要全部顯示,這時候就需要傾斜文字顯示,當然我做這個不是因爲無法顯示,因爲我們的設計就是斜着的哈哈。(你要是想y軸傾斜也是一樣的配置)

用到的是xAxis.axisLabel 屬性

axisLabel: {
              interval:0, //座標刻度之間的顯示間隔,默認就可以了(默認是不重疊)
               rotate:38   //調整數值改變傾斜的幅度(範圍-90到90)
            }

那麼問題來了,此時效果如下

很明顯在文字過長的時候文字下方被切掉了,還是顯示不全

這時候需要grid屬性


grid: {
left: '18%',
bottom:'38%'
},

這樣就好了,這些屬性具體的使用方法可以查看ECharts的官方文檔寫的很詳細,也很易懂,這裏附上官方API地址

https://echarts.baidu.com/option.html#toolbox

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章