首页 > 其他分享 >有间隙得饼图实现方法

有间隙得饼图实现方法

时间:2023-09-05 18:04:27浏览次数:29  
标签:borderColor name 间隙 实现 sum value color 方法

有两种办法:

第一种就是加border:适用于饼图内之间数值极差很小得情况。

第二种就是将间隙当作饼图得一部分,只不过色块是透明的而已。

data.push(
          {
            value: item.dataNum,
            name: name,
            rateData:item.dataRate,
            itemStyle: {
                normal: {
                    borderWidth: 1,//第一种方法就是这里这种
                    borderColor: color[i],
                }
            },
            label: {
                color: color[i]
            },
          }
      //这里就是第二种方法,加入透明得色块构成饼图的一部分 ,{ value: sum/100,//数值控制间隔大小 sum是value总和 name: "", itemStyle: { normal: { color: "rgba(0, 0, 0, 0)",//均为透明颜色 borderColor: "rgba(0, 0, 0, 0)", borderWidth: 0, }, }, } );

 

标签:borderColor,name,间隙,实现,sum,value,color,方法
From: https://www.cnblogs.com/hhcome/p/17680357.html

相关文章

  • 前端实现轮询
    /****@paramcallback需要轮询的函数*@paraminterval轮询的间隔时间*@returns*/exportfunctionpollFn(callback,interval=1000){lettimerId;//是否停止轮询letisStop=false;//轮询请求constpollFetch=async()=>{awaitcall......
  • Web编辑器实现WORD粘贴图片自动上传
    ​ 这种方法是servlet,编写好在web.xml里配置servlet-class和servlet-mapping即可使用后台(服务端)java服务代码:(上传至ROOT/lqxcPics文件夹下)<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%@     page contentType="text/html;cha......
  • 批处理实现局域网连接打印机
     以下代码仅适用于连接其他主机上的打印机,需要知道主机的IP地址,用户名或者密码。为了方便可以共享的时候设置为空密码(策略设置那里要打开允许空密码登陆)这样就不用添加网络凭据了 @echooff::获取管理员身份%1mshtavbscript:CreateObject("Shell.Application").ShellE......
  • .NET6.0实现IOC容器
    .NET6.0实现IOC容器IOC的作用这里省略…只对如何使用进行说明。1.创建一个.NET6应用程序这里使用.NET6.0WebAPI应用2.声明接口publicinterfaceIAuthService{boolCheckToken();}3.实现接口classAuthServiceImpl:IAuthService{publi......
  • 产品经理如何尽快提升自己?方法在这里
    作为产品经理,虽然针对产品开发本身有很大的权力,可以对产品生命周期中的各阶段工作进行干预,但从行政上讲,并不像一般的经理那样有自己的下属,但他又要调动很多资源来做事,因此如何做好这个角色是需要相当技巧的。  产品经理是一个终身学习的岗位。不断提升自己的知识和技能既是工作的......
  • FCKEditor实现WORD粘贴公式自动上传
    ​ 在之前在工作中遇到在富文本编辑器中粘贴图片不能展示的问题,于是各种网上扒拉,终于找到解决方案,在这里感谢一下知乎中众大神以及TheViper。通过知乎提供的思路找到粘贴的原理,通过TheViper找到粘贴图片的方法。其原理为一下步骤:监听粘贴事件;【用于插入图片】获取光标位置;【......
  • 用递归和非递归两种方式实现二叉树的中序遍历
    一、分析中序遍历遍历顺序为:左、根、右。二、递归实现publicclassNode{ publicintvalue;publicNodeleft;publicNoderight;publicNode(intdata){ this.value=data;}}publicvoidinOrderRecur(Nodehead){ if(head==null){ return;}i......
  • 购物车的实现 前端按钮 , 一次就是加一次数量吧
    后端实现都是查询list集合,查询list集合条件是userID物品id,list集合其实查询出的就是一个 因为物品id是唯一的。。,另外思想有点像批量删除,和单个删除有点类似用in来实现 in里面传入的也是list集合,非常的类似看了淘宝,美团外卖,多多买菜的基本都是查询list  list搞定......
  • element table 表格控件实现单选功能
      <el-table:data="tableData"borderstriperef="tableData"@row-click="singleElection"><el-table-columnlabel=""width="65"><templateslot-scope="......
  • JavaScript之同站多域名共享Token实现方案
    背景由于公司业务涉及到多个国家,每个国家站的访问的域名不同(指向同一个Web服务)在站内能够切换不同的国家,服务端一个token支持所有国家鉴权此时需要前端将Token等相关信息共享到即将跳转到的新站点,因为不同域,浏览器不会共享Cookie方案将Token相关信息通过URLQuery......