请选择 进入手机版 | 继续访问电脑版
 找回密码
 立即注册

QQ登录

只需一步,快速开始

nimotea
超级版主   /  发表于:2024-1-30 10:20  /   查看:183  /  回复:1
效果

image.png517387084.png

代码
  1. // 横向图
  2. option.xAxis.type = 'value';
  3. option.yAxis.type = 'category';
  4. option.yAxis.data = option.xAxis.data;
  5. option.xAxis.data = null

  6. // 新加对比背景色

  7. option.series[1].barGap = '-100%';
  8. option.series[1].z = 1;

  9. return option
复制代码
使用步骤:
方式1:
在Wyn管理后台的【导入】功能,导入以下Zip包,然后在仪表板设计器的左侧工具箱的【组件模板分类中】可以找到。
echarts组件模板-进度条.zip (400.69 KB, 下载次数: 13)

1 个回复

倒序浏览
nimotea
超级版主   /  发表于:2024-2-6 17:28:01
沙发
样式更新升级
image.png847729492.png
  1. // 系列边框颜色
  2. let borderColor1 = "#3EF1FE";
  3. let borderColor2 = "#3481CD";
  4. // 系列边框宽度
  5. let borderWidth = 2;


  6. // 横向图
  7. option.xAxis.type = 'value';
  8. option.yAxis.type = 'category';
  9. option.yAxis.data = option.xAxis.data;
  10. option.xAxis.data = null

  11. // 新加对比背景色

  12. option.series[1].barGap = '-100%';
  13. option.series[1].z = 1;
  14. let decal =  {
  15.                     symbol: 'diamond',
  16.                     dashArrayX: [5,5],
  17.                     dashArrayY: [1, 0],
  18.                     rotation: Math.PI / 6
  19. }
  20. option.series[1].itemStyle.decal = decal;
  21. option.series[1].itemStyle.borderColor = borderColor2;
  22. option.series[0].itemStyle.borderColor = borderColor1;
  23. option.series[1].itemStyle.borderWidth = borderWidth;
  24. option.series[0].itemStyle.borderWidth = borderWidth;


  25. return option
复制代码


回复 使用道具 举报
您需要登录后才可以回帖 登录 | 立即注册
返回顶部