（本文档仅供参考，请根据实际需求内容调整）
问题
仪表盘中有一筛选器和图形组件，如何根据筛选器的值控制图形的显示隐藏。
解决方案
可以考虑对筛选器组件创建如下宏代码调整实现
/**
* 宏示例：
* 切换筛选参数隐藏组件
* 事件：
* onBeforeRender
* 作用：
* 通过筛选器选择参数，根据参数隐藏对应标题的组件
* （组件标题是组件设置中的 "组件" -> "标题"）
* 注意事项：
* 1、这种代码用多了可能会有性能问题
*/
function main(page: IPage, portlet: IFilterPortlet) {
let id = page.getId() + portlet.getId()
// 设置筛选器切换值时的回调函数
portlet.setFilterValueChangeHandler((value: any) => {
let changeValue = value[0]
// 如果当前修改的值跟之前一样就直接return
if (changeValue === SmartbiXMacro.data[id]) return
// 通过筛选值获取同名的组件
let hidePortlets: IPortlet[] = page.getPortletsByTitle(changeValue)
hidePortlets.forEach((portlet: IPortlet) => {
// 将同名组件隐藏
portlet.hide()
})
// 通过上次隐藏的组件名称获取组件
let showPortlets: IPortlet[] = page.getPortletsByTitle(SmartbiXMacro.data[id])
showPortlets.forEach((portlet: IPortlet) => {
// 将上次隐藏的组件显示
portlet.show()
})
// 留存本次的筛选条件
SmartbiXMacro.data[id] = changeValue
})
}
注意：
1、组件名称与筛选器钻中值一致
2、对筛选器创建宏代码
效果如下图：
1、图形组件组件名称为2016
2、当筛选器选择2016时同名组件2016隐藏
