我已经创建了一个 Google map 应用程序并使用了 UI Bootstrap 。我想在 map 上显示列表,但不能。 我更改了列表的 z-index 但没有用。我将列表 html 代码放入 map div 但没有用。这是 css 问题吗?
最佳答案
您不能在 map 容器中放置任何东西,它会在您初始化 map 时被 API 覆盖。
您可以:
- 将其放在文档中的其他位置,并通过 CSS 将其放置在 map 上
- 或者用它作为custom control的内容
CSS 定位示例:
将两者(map-container 和 list-group )放在一个公共(public)容器中,并将 container
的位置设置为 relative
<div style="position:relative;">
<div id="map_canvas" style="height:300px;"></div>
<ul class="list-group" style="">
<li class="list-group-item active">item#1</li>
<li class="list-group-item">item#2</li>
<li class="list-group-item">item#3</li>
</ul>
</div>
列表组的 CSS(使用 margin
在 map 中应用列表组的填充):
.list-group{
position:absolute;
top:0;
margin:20px;
}
关于html - 如何在谷歌地图上显示 Bootstrap 列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21521328/