Echarts柱状图百分比显示
2024-10-19 06:19:47
option = { tooltip: {
trigger: 'item',
formatter:'{c}%' //这是关键,在需要的地方加上就行了
},
grid: {
borderWidth: 0,
y: 80,
y2: 60
},
xAxis: [
{
type: 'category',
show: false,
data: ['Line', 'Bar', 'Scatter', 'K', 'Pie', 'Radar', 'Chord', 'Force', 'Map', 'Gauge', 'Funnel']
}
],
yAxis: [
{
type: 'value',
show: false
}
],
series: [
{
name: 'ECharts例子个数统计',
type: 'bar',
itemStyle: {
normal: {
color: function(params) {
// build a color map as your need.
var colorList = [
'#C1232B','#B5C334','#FCCE10','#E87C25','#27727B',
'#FE8463','#9BCA63','#FAD860','#F3A43B','#60C0DD',
'#D7504B','#C6E579','#F4E001','#F0805A','#26C0C0'
];
return colorList[params.dataIndex]
},
label: {
show: true,
position: 'top',
formatter: '{b}\n{c}%' //这是关键,在需要的地方加上就行了
}
}
},
data: [12,21,10,4,12,5,6,5,25,23,7],
}
]
};
结果如下:
附上官网链接:http://echarts.baidu.com/echarts2/doc/example/bar14.html
最新文章
- What is the DD in java web application
- http缓存提高性能
- MagSpoof:能预测并窃取你下一张信用卡号码的廉价设备
- SUID或SGID程序中能不能用system函数
- JS将下拉框的disable变为able的方法
- HDU-4696 Answers 纯YY
- 使用Eclipse建立Maven的SpringMVC项目
- Oauth支持的5类 grant_type 及说明
- js判断参数是否为非数字
- 信号监测---verilog
- 为什么 array.foreach 不支持 async/await
- canvas三角函数模拟水波效果
- Java中IO的简单举例
- web05-CounterServlet
- java基础练习 17
- jquery基础研究学习【基础】
- Ocelot(四)- 认证与授权
- SpringBoot | 第一章:第一个SpringBoot应用
- Ryubook_1_switch_hub_部署执行
- postgres外部表如何修改源码适配pg升级
热门文章
- odoo 开发基础 -- 视图之widget
- gvim配置相关
- RocketMq(一)初识消息中间件
- ThreadPoolExecutor策略配置以及应用场景
- [Java初探实例篇02]__流程控制语句知识相关的实例练习
- 第三方登录:微信扫码登录(OAuth2.0)
- LeetCode 169. Majority Element解题方法
- B 树、B+ 树、B* 树
- MWeb 生成静态网站&;博客
- Silverlight 查询DataGrid 中匹配项 ,后台改变选中行颜色