1. 程式人生 > >echarts常用的配置項

echarts常用的配置項

chart 學習總結 標題 spl line orm 但是 ott 刻度

最近使用echarts可視化的業務,但是有一些配置項需要修改,把這段時間的學習總結一下

1. 修改默認配置

 a. 去掉分割線和網格線,在xAxis或者yAxis中設置  

    splitLine: {
        show: false
    }

 b. 修改標題背景和顏色

      

title: {
        backgroundColor: ‘#fff‘,
        textStyle: {
            fontWeight: ‘normal‘,
            color: ‘#ff00ff‘
        }
    }

 c. 設置坐標軸字體顏色和寬度,在xAxis或者yAxis中設置即可

    

axisLine:{
             lineStyle:{
                        color:‘yellow‘,
                        width:2
                    }
         }

 d. 設置圖形在頁面出現的位置(一般處於中間)用於解決空間過小

   

grid: {
         left: ‘3%‘,
         right: ‘4%‘,
         bottom: ‘3%‘,
         containLabel: true,
         y: 
10 // 設置從y為10開始 }

e:設置y,x軸不顯示

xAxis: {
            show: false
     },
  yAxis: {
          show: false
        }

f:y軸刻度線不顯示,但是y軸字段顯示

yAxis: {
        axisTick:{
                    show:false
                },
        axisLine:{
                    lineStyle:{
                        color:‘#FF7B24‘,
                        width:
0 } } }

d:設置tooltip提示框:

  formatter 函數可以格式化默認的顯示,用戶可以在裏面實現自己的顯示數據

echarts常用的配置項