要求：每个数值显示具体百分比，计算方式为： effect_cnt/total_cnt
数据结构为：{ "dt": "20240110", "effect_cnt": 725, "total_cnt": 1387, "both_effect_cnt": 912, "green_cnt": 650 },文章来源：https://www.toymoban.com/news/detail-809281.html
series: [
{
name: '特效',
type: 'bar',
data: this.rows.map(item => item.effect_cnt),
label: {
show: true,
position: 'inside',
formatter: function(params) {
return params.data.value;
}
}
},打印 formatter 的 params 里面只有 “effect_cnt” 的值，如果要进行计算，需要 params 里面包含 “total_cnt” 文章来源地址https://www.toymoban.com/news/detail-809281.html
{
name: '特效',
type: 'bar',
data: this.rows.map(item => ({
value: item.effect_cnt,
total_cnt: item.total_cnt
})),
label: {
show: true,
position: 'top',
formatter: function(params) {
const value = params.data.value;
const totalCnt = params.data.total_cnt;
if (totalCnt === 0) {
return '0%';
}
if (isNaN(value) || isNaN(totalCnt)) {
return '';
}
const percentage = ((value / totalCnt) * 100).toFixed(2) + '%';
return value + '次' + '\n' + percentage;
}
}
},到了这里，关于Echarts 柱状图显示百分比的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
