标签：function name legend 图例 Smartbi 组件 formatter options
-
右击组件选择组件设置
-
然后点击最下面的自定义属性
-
添加以下代码
// 其他代码省略
"legend": {
// 其他代码省略
"formatter": "function(name) {return name}",
// 这里一定要加formatter 不然宏里面获取不到这一项 无法进行后续操作
},
- 添加之后点击确定和外面的保存按钮
- 然后右击组件选择宏管理
- 选中当前图表右击 新建客户端宏
- 名称自己可以按照对应的功能起一个；事件选择组件渲染后
- 然后输入以下代码
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)
}
}
- 保存宏，然后在组件编辑页面刷新即可看到结果
- 如果没出现想要的效果，可以直接打开控制台查看报错信息
标签：function,name,legend,图例,Smartbi,组件,formatter,options 来源： https://blog.csdn.net/weixin_43711783/article/details/122236177
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。