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

猜你喜欢

转载自blog.csdn.net/momDIY/article/details/106217584
今日推荐