Smartbi环形图图例legend后面加百分比

1. 右击组件选择组件设置
   

2. 然后点击最下面的自定义属性
   

3. 添加以下代码

// 其他代码省略
"legend": {
		// 其他代码省略
		"formatter": "function(name) {return name}",
		// 这里一定要加formatter 不然宏里面获取不到这一项 无法进行后续操作
	},

4. 添加之后点击确定和外面的保存按钮
5. 然后右击组件选择宏管理
   
6. 选中当前图表右击 新建客户端宏
   
7. 名称自己可以按照对应的功能起一个；事件选择组件渲染后
   
8. 然后输入以下代码

function main(page: IPage, portlet: IEChartsPortlet) {
    let options = portlet.getChartOptions() // 获取组件对象 我们要操作的东西基本都在这里面
    let optionsData = options.series[0].data // 获取当前图表的一些值 具体内容可以用log打印出来看 在smartbi的页面打开控制台就能看到这里的日志输出
    options.legend[0].formatter = (
        function (name: any) {
            optionsData.forEach(e => {
                console.log(e)
                if(e.name == name)
                name += " : "+e.value[0]+" "+e.label.formatter
            })
            return name
        }
    )
    // options.legend[0].formatter是我们上面第3步设置的formatter 这里我们直接通过新建一个匿名函数将它替换掉 这样就能输出我们想要的内容了
    let chartInstance = portlet.getChartInstance()
    setTimeout(() => {
        readload() // 重新加载图表 渲染图例内容
    }, 10);
    function readload() { 
        chartInstance.setOption(options)    
    }
}

9. 保存宏，然后在组件编辑页面刷新即可看到结果
10. 如果没出现想要的效果，可以直接打开控制台查看报错信息

标签：function,name,legend,图例,Smartbi,组件,formatter,options
来源： https://blog.csdn.net/weixin_43711783/article/details/122236177