饼图/圆环图-如何将标签中的百分比改成字段数值

问题描述

在饼图/圆环图组件模板资源中，大部分饼图/圆环图组件模板都通过宏代码设置了一些特殊效果。同时在宏代码中，也将数据标签处理成百分比数据显示了。那么，如果不想要数据标签显示百分比，而是直接显示字段对应的数值，应该怎么处理呢？

宏代码中设置了数据标签为百分比的组件模板包括

解决方法

1、在复制过来并替换数据之后的组件模板上，右键→宏管理

2、在宏管理界面上，点击一下刷新按钮。并对应的组件模板的宏菜单，打开宏代码编辑界面

3、接下来需要修改宏代码，由于各个组件模板实现标签百分比显示的逻辑不一样，所以需要根据组件进行修改。

玫瑰环形图-标签在外

3.1、找到如下代码，将其中的 ‘{d}%’中的‘d’修改为'c'，同时删除百分号

修改后如下：

3.2、点击宏编辑界面右下角工具栏上的“保存”按钮。回到组件编辑界面，点击工具栏上的“刷新”按钮，即可看到效果。如下：

玫瑰环形图-标签在内

3.1、找到如下代码，将如下代码

serie.data[i].label.formatter = Number(parseFloat(serie.data[i].displayValue[1].replace(/,/g, '')) / total * 100).toFixed(2) + '%';

替换成

serie.data[i].label.formatter = serie.data[i].displayValue[1];

修改后如下：

3.2、点击宏编辑界面右下角工具栏上的“保存”按钮。回到组件编辑界面，点击工具栏上的“刷新”按钮，即可看到效果。如下：

圆角断点环形图

3.1、找到如下代码，将代码

var after = toPercent(serie.data[i].value[0] / total);

替换成

var after = serie.data[i].value[0];

替换后如下：

3.2、点击宏编辑界面右下角工具栏上的“保存”按钮。回到组件编辑界面，点击工具栏上的“刷新”按钮，即可看到效果。如下：

圆角饼图

3.1、找到如下代码，将代码

serie.data[i].label.formatter = percent.toFixed(1) + "%";

替换成

serie.data[i].label.formatter = serie.data[i].value[0]+'';

替换后如下：

3.2、点击宏编辑界面右下角工具栏上的“保存”按钮。回到组件编辑界面，点击工具栏上的“刷新”按钮，即可看到效果。如下：

发光玫瑰图

3.1、找到如下代码，将

3.2、点击宏编辑界面右下角工具栏上的“保存”按钮。回到组件编辑界面，点击工具栏上的“刷新”按钮，即可看到效果。如下：

发光环形图

3.1、找到如下代码，将

3.2、点击宏编辑界面右下角工具栏上的“保存”按钮。回到组件编辑界面，点击工具栏上的“刷新”按钮，即可看到效果。如下：

注意事项

1、本文档不适用于 饼图/圆环图组件模板资源中的 【玫瑰环形图-标签在内】 组件模板