如何创建含多个独立DynamicMap的Holoviews/Bokeh应用？

1. 让控件与对应图表绑定（解决视觉关联问题） #

默认情况下Holoviews会把所有DynamicMap的控件集中堆在布局右侧，确实会让用户搞不清哪个控件对应哪个图表。我们可以给每个DynamicMap单独指定控件位置，把控件放在图表的上方或下方，而非全局右侧：

# 给每个DynamicMap设置控件在自身顶部
dmap1 = dmap1.opts(widget_location='top')
dmap2 = dmap2.opts(widget_location='top')
dmap3 = dmap3.opts(widget_location='top')
dmap4 = dmap4.opts(widget_location='top')

# 构建2×2网格布局
layout = (dmap1 + dmap2 + dmap3 + dmap4).cols(2)

这样每个图表的控件会直接贴在自己上方，用户一眼就能对应上关联关系。

2. 分离每个图表的工具栏（解决工具栏合并问题） #

Bokeh默认会合并同布局内所有图表的工具栏，要让每个图表拥有独立工具栏，只需给每个DynamicMap指定工具栏位置即可：

# 给每个DMaps设置独立的左侧工具栏+顶部控件
dmap1 = dmap1.opts(toolbar_location='left', widget_location='top')
dmap2 = dmap2.opts(toolbar_location='left', widget_location='top')
dmap3 = dmap3.opts(toolbar_location='left', widget_location='top')
dmap4 = dmap4.opts(toolbar_location='left', widget_location='top')

设置后每个图表都会拥有自己的工具栏，不会再出现合并混淆的情况。

3. 处理超过两个DMaps的布局场景 #

当布局内DMaps数量超过2个时，除了用cols(n)控制每行显示数量，还要注意控件不会互相挤压。如果控件较多，建议把widget_location设为'bottom'；另外用hv.GridSpace替代hv.Layout会更适合网格场景，它对多DMaps的控件和工具栏对齐更友好：

# 用GridSpace构建2×2网格
grid = hv.GridSpace({(0,0): dmap1, (0,1): dmap2, (1,0): dmap3, (1,1): dmap4})
# 统一设置所有网格项的控件和工具栏位置
grid = grid.opts(
    hv.opts.DynamicMap(widget_location='top', toolbar_location='left')
)

GridSpace会自动帮你对齐每个网格内的图表、控件和工具栏，不会出现布局混乱。

部署时的小提示 #

如果要部署为Bokeh应用，记得用Bokeh的Server来加载，确保所有配置生效：

from bokeh.server.server import Server

def create_app(doc):
    layout = (dmap1 + dmap2 + dmap3 + dmap4).cols(2).opts(
        hv.opts.DynamicMap(widget_location='top', toolbar_location='left')
    )
    doc.add_root(hv.render(layout))

server = Server({'/': create_app}, port=5006)
server.start()
server.io_loop.start()

这样配置后，你的2×2网格里每个DynamicMap都会有独立的控件和工具栏，和对应图表直接关联，用户体验会顺畅很多。

内容的提问来源于stack exchange，提问作者fccoelho