Echart柱状图改成横向竖向电池图或者说是横向竖向进度条形图示例；

韩天尊跑路

于 2024-12-30 16:40:31 发布

阅读量346

点赞数 4

CC 4.0 BY-SA版权

文章标签： echarts vue.js

本文链接：https://blog.youkuaiyun.com/qq_40739261/article/details/144829381

Echart柱状图弄成电池图或者柱状图弄成进度条形图；里面的具体数据，根据自己的实际情况书写；这里只写了横向；需要竖向的话，x y轴的类型换一下；然后偏移量需要修改。后面的label需要修改一下样式
在这里插入图片描述

initBusyActivityEchart() {
   
   
      let that = this;
      let myChart = null;
      let chartDom = document.getElementById("busy-activity");
      myChart = echarts.init(chartDom);
      let colors = ["#8993EA","#22ABEE","#FF6767","#9B64E5","#FCCF54","#57BC6E","#526ADE",]
      
      let seriesData = [
        {
   
    name:'辣条',value:100,percent:0},
        {
   
    name:'薯片',value:20,percent:0},
        {
   
    name:'可乐', value: 30, percent: 0},
        {
   
    name:'亲嘴烧',value:5,percent:0},
        {
   
    name:'纯牛奶', value: 400