首页 > 其他分享 >echarts的饼图的数据都为0,展示饼图的样式以及方法

echarts的饼图的数据都为0,展示饼图的样式以及方法

时间:2023-06-15 11:36:42浏览次数:31  
标签:展示 样式 50% 扇区 边框 echarts 360

series: [
{
name: '概况',
type: 'pie',
label:{
formatter: '{b}({d}%)',
color:'#555555'
},
radius: ['30%', '50%'],//小圆和大圆的半径
center: ['50%', '40%'],//饼状图的位置
avoidLabelOverlap: false,
startAngle:180,//起始角度,支持范围[0, 360]。
minAngle: 10, //最小的扇区角度(0 ~ 360),用于防止某个值过小导致扇区太小影响交互
itemStyle:{
//通过设置边框宽度,并给边框设置背景同色来表示扇形直接的间隔距离
normal: {
borderWidth: 5,
borderColor: '#fff',
}
},
data:this.valueData
}
]

标签:展示,样式,50%,扇区,边框,echarts,360
From: https://www.cnblogs.com/czb1218/p/17482425.html

相关文章

  • 淘宝接口数据采集获得店铺详情api接口获取源代码调用示例展示
    ​ 淘宝店铺详情API接口是阿里巴巴开放平台提供的一种API接口,用于获取指定淘宝店铺的详细信息,如店铺名称、店铺简介、开店时间、主营类目等信息。具体来说,淘宝店铺详情API接口(免费获取调用)的作用包括:1.获取店铺基本信息:可以获取店铺名称、描述、卖家主页、好评率等基本信息,帮......
  • 给多种状态的盒子赋予不同样式
    开发时经常会遇到这样的样式需求:【根据返回的字段控制当前盒子使用不同的样式】一般来说,字段内容都为两种:true/false,或0/1,或两个不同的字符串,这种情况下可以使用【动态class+三元表达式】的方法解决。但偶然也会出现多个的情况,此时三元表达式就显得不够用了,要么会判断很多层变得......
  • vue+css: 引用的组件快速改变滚动条样式
    在a组件页面内有b组件,b组件产生的滚动条太丑不好看但是又不想改变b组件(b组件公共用的地方很多)又不想专门复制份在此基础上改。只要在使用的组件上增加css代码即可同时让组件内滚动条生效,原理是因为此滚动条相当于未定义类的当前组件全局。所以可以直接使用并生效comp.vue<styl......
  • html 中拦截 js 的样式更改
    比如拦截html标签的font-size样式的更改:...<body><script>varobserver=newMutationObserver(function(mutations){mutations.forEach(function(mutation){if(mutation.type==='attributes'&&mutation.attribu......
  • 通过Canvas在浏览器中更酷的展示视频
    有了Canvas可以更灵活的展示体验更好的视频,能够与页面更好的融合。文/MatthewMcClure译/Johnhttps://mux.com/blog/canvas-adding-filters-and-more-to-video-using-just-a-browser/视频无疑是网页中最引人关注的元素之一。在一个兼容性良好的网页内,视频的动态画面让网页内容......
  • 直播软件app开发,vue里tab菜单横向展示,可分页功能组件实现
    直播软件app开发,vue里tab菜单横向展示,可分页功能组件实现子组件: <template><div>  <el-buttonv-if="move!=0&&!dataLen"size='small'icon="el-icon-arrow-left"@click="navPrev"></el-button>   <ulref......
  • ElementUIplus --- el-menu 菜单折叠的情况下 二级菜单选中 一级菜单lcon 高亮 样式设
    submenu部分代码示例<template><templatev-for="(item,index)inprops.children":key="index"><el-sub-menuv-if="!item.meta.hidden&&item.children":index="item.name"><templat......
  • ELK分析Nginx日志和可视化展示
    ELK分析Nginx日志和可视化展示JAVA编程Linux学习 2023-06-0508:35 发表于山东收录于合集#nginx5个#nginx日志可视化1个#nginx日志1个一、概述使用ELK收集nginxaccess日志,利用Grafana做出一套可视化图表 二、环境准备环境说明操作系统:centos7.6docker......
  • ELK分析Nginx日志和可视化展示
    ELK分析Nginx日志和可视化展示JAVA编程Linux学习 2023-06-0508:35 发表于山东收录于合集#nginx5个#nginx日志可视化1个#nginx日志1个一、概述使用ELK收集nginxaccess日志,利用Grafana做出一套可视化图表 二、环境准备环境说明操作系统:centos7.6docker......
  • CSS(精灵图、字体图标、三角、用户界面样式、vertical-align、溢出省略号、常用布局技
    一.精灵图(重点)1.1为什么需要精灵图一个网页中往往会应用很多小的背景图像作为修饰,当网页中的图像过多时,服务器就会频繁地接收和发送请求图片,造成服务器请求压力过大,这将大大降低页面的加载速度。为什么使用精灵图(目的):·为了有效地减少服务器接收和发送请求的次数,提高......