echarts环形占比图 环形百分比

const pieConf = {
  title: {
    text: '40%',
    left: 'center',
    top: 61.5,
    textStyle:{
      color:'#1890fe'
    }
  },
  visualMap: {
    show: false,
  },
  series: [
    {
      type: 'pie',
      //环形显示饼状图,实际上显示的是50-80之间的部分
      //上限不建议设置为100,echarts自带动画效果,设置为100动画效果很丑
      radius: ['50%', '80%'],
      center: ['50%', '50%'],
      data: [   
      //itemSyle是单项的背景颜色设置。
        { value: 60, itemStyle: { color: '#f1f1f1' } },
        { value: 40, itemStyle: { color: '#1890fe' } },
      ],
      label: {
        //将视觉引导图关闭
        show: false,
      },
      itemStyle:{
      	//设置的是每项之间的留白
        borderWidth:7,
        borderColor:'#fff'
      },
      // 初始化echarts的动画效果
      animationType: 'scale',
      animationEasing: 'elasticOut',
      animationDelay: function (idx) {
        return Math.random() * 200;
      }
    }
  ]

原文链接: https://blog.csdn.net/qq_47246331/article/details/119598704

echarts环形进度是一种数据可视化的表,可以用来展示一个圆形(或环形)的进度,通过形形态的变化直观地反映出数据的进展情况。环形进度通常由一个圆环组成,根据数据的大小,圆环的一部分会被填充出来,形成一个扇形或弧形,展示数据的完成程度。这种表可以直观地展示数据的百分比或比例关系,非常适合用于展示任务进度、完成率、比例比等信息。 具体实现环形进度的方法可以参考csdn博客中的教程https://blog.csdn.net/weixin_40998254/article/details/81560000,该教程介绍了如何使用echarts库来创建环形进度,并提供了示例代码和详细步骤。通过按照教程中的指导,你可以轻松地创建一个具有动态进度效果的环形进度,并根据自己的需求进行定制和调整。 总结来说,echarts环形进度是一种用于数据可视化的表,可以直观地展示数据的进度和比例关系。通过参考所提供的csdn博客教程,你可以学习如何使用echarts库来创建和定制环形进度。<span class="em">1</span> #### 引用[.reference_title] - *1* [圆形(环形)进度条](https://download.csdn.net/download/weixin_40998254/10595267)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值