echarts常見樣式速查(修改頻率最高的幾種樣式)

echarts 最常見的幾種樣式(可能是修改頻率最高的),歡迎補充~

柱狀圖柱寬度


series:{
    barWidth: '8px',
}

座標軸字體顏色

// yAxis/xAxis attr
axisLabel: {
  textStyle: {
    color: '#938258'
  }
}

隱藏座標軸刻度線

// yAxis/xAxis attr
axisLine : {show: false},

圖表位置設定

grid: {
  left: '3%',
  right: '4%',
  bottom: '3%',
  containLabel: true // 外框包含刻度數據
}

網格線樣式

// yAxis/xAxis 屬性
  splitLine: {
    lineStyle: {
      color: 'rgba(255,255,255,0.1)'
    }
  },

折線圖點樣式

series : [ {
symbol:'circle'
}]
支持的類型
ECharts 提供的標記類型包括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'

折線圖下方區域漸變

  areaStyle: {
    color: new this.$echarts.graphic.LinearGradient(
      0, 0, 0, 1,
      [
        { offset: 0, color: 'rgba(7, 128, 182, 0.5)' }, // 柱圖漸變色
        { offset: 0.5, color: 'rgba(7, 128, 182, 0.3)' }, // 柱圖漸變色
        { offset: 1, color: 'rgba(7, 128, 182, 0)' } // 柱圖漸變色
      ]
    )
  }

END

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