如何实现点击某个字段会弹出对应字段的明细数据的表?

场景:客户想要实现如下场景在大屏pro里面要如何配置?

如何实现柱状图点击某个柱子会弹出对应柱子的明细数据的表 - 图1

操作步骤如下:

①新建一个交互参数,如图:

如何实现柱状图点击某个柱子会弹出对应柱子的明细数据的表 - 图2

②然后创建一个新的动态图层,在动态图层里面放入想要展示的数据的明细的轮播表

如何实现柱状图点击某个柱子会弹出对应柱子的明细数据的表 - 图3

③在X号这里放入一个热区组件,并在热区组件里面传入开头创建的参数,用来控制图层的关闭。【X号用的是文字组件,将热区组件盖在文字组件上面即可】如图:

如何实现柱状图点击某个柱子会弹出对应柱子的明细数据的表 - 图4

④做完后退出动态图层后开启该动态图层的'响应事件'后该图层就会隐藏

如何实现柱状图点击某个柱子会弹出对应柱子的明细数据的表 - 图5

⑤在对条形图做'图表联动'联动想要显示的轮播表,并选择要控制的字段

如何实现柱状图点击某个柱子会弹出对应柱子的明细数据的表 - 图6

⑥最后在点击'窗口编辑'输入需要响应的值,这样当你在条形图里面选择想要查看的值的时候就会显示出来对应的值的明细数据

如何实现柱状图点击某个柱子会弹出对应柱子的明细数据的表 - 图7

如此,便完成了开头想要实现的场景了