echarts-liquidfill 水球显示小数点
使用echarts-liquidfill.js的水球,水球上显示的文字可以使用chartOption.series[0].label.normal.formatter设置,想显示什么显示什么。
水球插件下载地址
https://files.cnblogs.com/files/tong2018/echarts-liquidfill-master.zip
var chartOption = {
title: {
subtext: '',
subtextStyle: {
fontSize : 14,
fontFamily:'serif',
color: '#ffffff'
},
top: '80%',
textAlign: 'center',
left: '50%'
},
series: [{
color: ['#86FDFD'],//水波颜色
type: 'liquidFill',
waveAnimation: false,//是否流动水球
animation: false,
radius: '55%',
waveLength: '80%',//波长
waveHeight: '60',//波长
amplitude: '8%',//振幅
outline: {
show: true,
borderDistance: 4,//内环宽
itemStyle: {
color: '#14297b',//内环色
borderColor: '#86FDFD',//外环色
borderWidth: 7//外环宽
}
},
backgroundStyle: {
color: '#14297b'//水球背景色
},
label: {
normal: {
formatter:"34.34%",//水球上显示文字,可以设置任意文字
show: true,
textStyle: {
color:'#ffffff',//水球显示文字颜色
fontSize: '22',
fontFamily:'serif',
fontWeight: '100'
}
}
},
data: [0.34]
}]
};
echarts-liquidfill 水球显示小数点的更多相关文章
- echarts中饼图显示百分比
通过echarts制作饼图,需要通过鼠标移动到对应的扇形才能才看数值和百分比. 解决这个问题参考的是将鼠标移动到扇形上的显示方法: tooltip : { trigger: ' ...
- echarts柱状图标签显示不完全的问题
echarts 柱状图当x轴标签数目超过一定数目时在小尺寸设备上第一个和最后一个标签不显示(不是重叠),axisLabel设置interval:0也不起作用; 解决办法: 这个问题存在于4.0版本以上 ...
- echarts饼图不显示数据为0的数据
首先阐述下为什么会有这个需求,这个和echarts自身的显示效果有关. 如果你选择的展示图形为饼图,然后你的数据里有一条数据为0,那么展示的数据就为一条直线,看上去效果并不好, 会很突兀. 当然如果你 ...
- ECharts图表tooltip显示时超出canvas图层解决方法
我们在做ECharts图表的时候可能会遇到tooltip显示时超出了canvas图层范围,并且被其它z-index较高的div容器遮盖,这是悬浮展示信息就看不全,我们根据官网文档的配置项查询发现con ...
- tab切换echarts无法正常显示问题
项目中使用到了Echarts来在展示图表,两个tab切换页面中都存在图表,页面加载完成后 对所有图表进行了初始化和绘制,然后切换查看时,发现图表的宽度不正确.,第一个tab显示是很正常的,但是第二个t ...
- Echarts 不能百分比显示或显示有问题
1,设折线图宽为100%(如:容器div的class=“RiBarBot”宽为880px),刚初始化时隐藏折线图(或后期刷新.隐藏与显示折线图时),当点击显示折线图时,获取到的宽只有100px,并不是 ...
- 我遇到的Echarts 最大值不显示&平均值不正常
用Echarts做图表的时候,遇到最大值不显示和平均值不正常的问题,如图: 找了半天,原来是X轴6个坐标有7个数据,只是最后那个数据没有显示出来,而且还是最大的,无语. 加上第七个坐标之后,就显示正常 ...
- Datagridview中数字格式列 不显示小数点前面的0
用代码设置DataGridView中某列为数字格式,但当小数为0.*的时候,前面的0却不显示.只显示.*. 看网上有说: 调整本地设置,控制面板-区域和语言选项,在弹出框的区域选项卡中,选择自定义,在 ...
- 解决echarts饼图不显示数据为0的数据
如图所示 饼图数据为0但是还是会显示lableline和lable 解决方法 var echartData = [{ value: data_arry[0]==0?null:data_arry[0], ...
随机推荐
- mongodb 前人埋坑的奇怪问题
接手一个很老的项目 数据库用的mongodb 代码里的collections表名用的auth没问题 直接去monogdb show table 确实有auth表 想在本地登录,看看用户信息 > ...
- linux awk详解
awk: awk是一个强大的文本分析工具,相对于grep的查找,sed的编辑, awk在其对数据分析并生成报告时,显得尤为强大. 简单来说awk就是把文件逐行的读入,以空格为默认分隔符将每行切片,切开 ...
- Margin of Error|sample size and E
8.3 Margin of Error 由该公式可知: To improve the precision of the estimate, we need to decrease the margin ...
- SHELL用法八(Grep语句)
1.SHELL编程Grep语句案例实战 1)Find是Linux操作系统文件和目录的路径检索.查询工具,而Grep是Linux系统下文本文件内容检索或者匹配工具,Grep称为全局正则表达式检索工具,在 ...
- get 传中文,可以通过下面这种方式
window.location.href=encodeURI("<%=path%>/XXX.XXX?name=中文"); 然后在后台通过new String(reque ...
- overflow属性的应用
在使用JQueryUI chosen插件的时候,由于页面布局的原因,下拉列表框超出div范围,图形效果严重变形,一点解决的思路都没有,最后请教公司前端,瞬间解决,原来使用CSS 中的overflow属 ...
- Java IO: 并发IO
原文链接 作者: Jakob Jenkov 译者: 李璟 有时候你可能需要并发地处理输入和输出.换句话说,你可能有超过一个线程处理输入和产生输出.比如,你有一个程序需要处理磁盘上的大量文件,这个任务可 ...
- Python爬虫-selenium的使用(2)
使用selenium打开chrome浏览器百度进行搜索 12345678910111213141516171819202122232425 from selenium import webdriver ...
- 「CometOJ」Contest #11
Link Aeon 显然字典序最大就是把最小的字母放在最后 Business [动态规划] 简单dp dp[i][j]dp[i][j]dp[i][j]表示到第iii天,当前有jjj块钱,最后返还的钱最 ...
- Ionic3学习笔记(八)使iOS端、Android端 Navbar 透明化
本文为原创文章,转载请标明出处 若要使iOS端 Navbar 透明,只需要给 ion-navbar 添加 transparent 属性,但是Android端依旧会有一条border在,所以再给 ion ...