echarts定制化柱状图——条纹柱状图

简单记录下echarts定制化柱状图的开发,省的以后还要去翻配置项,以下代码echarts官网均可直接运行

javascript 复制代码
option = {
  xAxis: {
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [120, 200, 150, 80, 70, 110, 130],
      type: 'pictorialBar',
      symbol:'rect',
      symbolMargin:'2',
      symbolSize:[30,5],
      symbolRepeat:true,
      barWidth:42,
      symbolClip:true
      
    },
    {
      color:'transparent',
      type:'bar',
       barWidth:46,
      barGap:'-100%',
      itemStyle:{
        borderColor:'green'
      },
      data:[130, 210, 160, 90, 80, 120, 140]
    }
  ]
};
相关推荐
curdcv_po2 分钟前
ts 非空 断言, 后缀加感叹号!,有话要说!!!
前端
烛阴13 分钟前
快速上手Axios:前端开发者必备技能
前端·javascript
究极无敌暴龙战神X15 分钟前
Vite中定义@软链接
前端
摇摇奶昔x22 分钟前
Vue.js 中 “require is not defined“
前端·javascript·vue.js
烛阴32 分钟前
Cheerio DOM操作深度指南:轻松玩转HTML元素操作
前端·javascript·后端
rookie fish1 小时前
如何控制electron的应用在指定的分屏上打开[特殊字符]
前端·javascript·electron
hweiyu001 小时前
Electron简介(附电子书学习资料)
前端·javascript·electron
sunbyte1 小时前
50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | RandomChoicePicker(标签生成)
前端·javascript·vue.js
啃火龙果的兔子1 小时前
前端八股文 - CSS 篇
前端·css