本文档为您介绍通过单选框实现不同类型学校的散点层数据的切换展示,以及Tab列表和单选框的双重触发判断方法。例如Tab列表选择小学,单选框选择公办,那么最终实现在大屏上展示所有公办小学的散点层信息。
前提条件
背景信息
需要实现的交互:通过控制组件单选框内的全选/公办/私办选项和Tab列表内的小学/初中选项,控制目标组件散点层的显隐效果。
可实现方案有两种:
- 使用触发器控制对应散点层的显隐样式,本文使用此方案,操作步骤如下。您也可以通过转换器来实现,详情请参见如何使用Tab列表控制组件显隐。
- 切换散点层内的数据data/[],比较复杂,不建议使用此方案。
操作步骤
执行结果
所有连线和触发器都配置完成后,最终效果如下图所示。
以上配置实现了双重触发判断,即首先判断Tab列表中选择的是小学还是中学,在此基础上再判断单选框中选择的是民办、公办还是全选,最终组合筛选出对应的散点显示在大屏的地图区域中。