使用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 水球显示小数点的更多相关文章

  1. echarts中饼图显示百分比

    通过echarts制作饼图,需要通过鼠标移动到对应的扇形才能才看数值和百分比. 解决这个问题参考的是将鼠标移动到扇形上的显示方法:     tooltip : {         trigger: ' ...

  2. echarts柱状图标签显示不完全的问题

    echarts 柱状图当x轴标签数目超过一定数目时在小尺寸设备上第一个和最后一个标签不显示(不是重叠),axisLabel设置interval:0也不起作用; 解决办法: 这个问题存在于4.0版本以上 ...

  3. echarts饼图不显示数据为0的数据

    首先阐述下为什么会有这个需求,这个和echarts自身的显示效果有关. 如果你选择的展示图形为饼图,然后你的数据里有一条数据为0,那么展示的数据就为一条直线,看上去效果并不好, 会很突兀. 当然如果你 ...

  4. ECharts图表tooltip显示时超出canvas图层解决方法

    我们在做ECharts图表的时候可能会遇到tooltip显示时超出了canvas图层范围,并且被其它z-index较高的div容器遮盖,这是悬浮展示信息就看不全,我们根据官网文档的配置项查询发现con ...

  5. tab切换echarts无法正常显示问题

    项目中使用到了Echarts来在展示图表,两个tab切换页面中都存在图表,页面加载完成后 对所有图表进行了初始化和绘制,然后切换查看时,发现图表的宽度不正确.,第一个tab显示是很正常的,但是第二个t ...

  6. Echarts 不能百分比显示或显示有问题

    1,设折线图宽为100%(如:容器div的class=“RiBarBot”宽为880px),刚初始化时隐藏折线图(或后期刷新.隐藏与显示折线图时),当点击显示折线图时,获取到的宽只有100px,并不是 ...

  7. 我遇到的Echarts 最大值不显示&平均值不正常

    用Echarts做图表的时候,遇到最大值不显示和平均值不正常的问题,如图: 找了半天,原来是X轴6个坐标有7个数据,只是最后那个数据没有显示出来,而且还是最大的,无语. 加上第七个坐标之后,就显示正常 ...

  8. Datagridview中数字格式列 不显示小数点前面的0

    用代码设置DataGridView中某列为数字格式,但当小数为0.*的时候,前面的0却不显示.只显示.*. 看网上有说: 调整本地设置,控制面板-区域和语言选项,在弹出框的区域选项卡中,选择自定义,在 ...

  9. 解决echarts饼图不显示数据为0的数据

    如图所示 饼图数据为0但是还是会显示lableline和lable 解决方法 var echartData = [{ value: data_arry[0]==0?null:data_arry[0], ...

随机推荐

  1. 12款优秀的 JavaScript 日历和时间选择控件

    这些插件能够帮助  Web 开发人员更快速的实现各种精美的日历和时间选择效果. 1. The Coolest Calendar 界面非常漂亮的一款日期选择插件,有详细的使用文档,最新版本 1.5. 点 ...

  2. OpenCV 实现自己的线性滤波器

    #include "opencv2/imgproc/imgproc.hpp" #include "opencv2/highgui/highgui.hpp" #i ...

  3. win10安装revit失败,怎么强力卸载删除注册表并重新安装

    一些搞设计的朋友在win10系统下安装revit失败或提示已安装,也有时候想重新安装revit的时候会出现本电脑windows系统已安装revit,你要是不留意直接安装revit,只会安装revit的 ...

  4. <luogu1347>排序

    本来打算当打了个拓扑的板子 后来发现并不只是个板子 差不多 管他呢 #include<cstdio> #include<cstring> #include<iostrea ...

  5. firefox上网慢

    由于Chromium浏览器,打字的时候经常会跳字母,所以就换了firefox浏览器,但是FF上网的时候特别慢,而且大部分时间是花费在解析域名上.因此到网上找了许多资料,最终解决方法如下. 1.安装dn ...

  6. Python练习 ——名片管理系统(增添,删除,查找,修改)

    需要注意的一个地方是,如果你用的版本是3.6的,那么下面的用到的所有从外界接收信息所用到的input()用input()就行了,如果是2.7版本,那么如果接收的是字符串要用raw_input()(将接 ...

  7. unittest(9)- 使用ddt给测试用例传参

    # 1. http_request.py import requests class HttpRequest: def http_request(self, url, method, data=Non ...

  8. 使用JDBC CallableStatements执行存储过程

    Using JDBC CallableStatements to Execute Stored Procedures Connector / J完全实现了 java.sql.CallableState ...

  9. Beautiful Soup的用法(五):select的使用

    原文地址:http://www.bugingcode.com/blog/beautiful_soup_select.html select 的功能跟find和find_all 一样用来选取特定的标签, ...

  10. docker-compose的安装和设定

    docker的1.12版本中,swarm已经合体,docker-engine/swarm/docker-compose的三件套装已经变成两件.后续会不会将docker-compose进一步合体呢,想做 ...