问题描述
在饼图/圆环图组件模板资源中,大部分饼图/圆环图组件模板都通过宏代码设置了一些特殊效果。同时在宏代码中,也将数据标签处理成百分比数据显示了。那么,如果不想要数据标签显示百分比,而是直接显示字段对应的数值,应该怎么处理呢?
宏代码中设置了数据标签为百分比的组件模板包括
组件模板 |
---|
玫瑰环形图-标签在外 |
玫瑰环形图-标签在内 |
圆角断点环形图 |
圆角饼图 |
发光玫瑰图 |
发光环形图 |
解决方法
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、找到如下代码,将代码中的 '{d}%\n{b}' 改成 '{c}\n{b}'
修改后如下:
3.2、点击宏编辑界面右下角工具栏上的“保存”按钮。回到组件编辑界面,点击工具栏上的“刷新”按钮,即可看到效果。如下:
发光环形图
3.1、找到如下代码,将代码
var after = toPercent(serie.data[i].value[0] / total);
替换成
var after = serie.data[i].value[0];
、
替换后如下:
3.2、点击宏编辑界面右下角工具栏上的“保存”按钮。回到组件编辑界面,点击工具栏上的“刷新”按钮,即可看到效果。如下: