javascript - 引导模式未在谷歌地图标记点击上打开
问题描述
我尝试了几个选项,但没有成功。我的主要目标是打开一个带有位置信息的 Bootstrap modal.centered。我试图将触发按钮放到 infoWindow 上,但是当我点击它时,页面只显示灰色的半透明背景。我做了一个简单的地图,我试图测试。
My codepen: https://codepen.io/ilja-ankipovits/pen/QWWQyqK
我只添加了模式的开头和整个谷歌地图脚本。我是 google API 的新手,所以欢迎提供额外的解释。
解决方案
对于每个陷入理智问题的人,带着爱:):
div id="map"></div>
<script>
var map;
function initMap() {
var artavenue = {lat:59.441970, lng: 24.784039};
var artavenue2 = {lat:59.421521, lng: 24.724763};
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 4,
center: {lat:59.4370, lng:24.7536},
});
var markerA = new google.maps.Marker({
position: artavenue,
map: map,
title: 'Hello World!'
});
markerA.addListener('click', function(e) {
map.setCenter(this.position);
$('#art-avenue-modal').modal('show');
});
var markerB = new google.maps.Marker({
position: artavenue2,
map: map,
title: 'Hello World!2'
});
markerB.addListener('click', function(e) {
map.setCenter(this.position);
$('#art-avenue-modal2').modal('show');
});
}
</script>
推荐阅读
- css - 我如何在网格离子中显示我的图像
- python - to_json() 函数错误地导出了带有 float64 的 Pandas 数据框
- docker - 在 Visual Studio Code 中使用 Docker 和 WSL 2 进行开发 - -sh: code: not found
- php - 无法连接数据库,其显示连接失败SQLSTATE [HY000] [1044] 用户'@'localhost'对数据库'ecom'的访问被拒绝
- oauth-2.0 - Open ID Connect 导致 SSO 采用混乱?
- vb.net - VB.NET 如果没有选中单选按钮,如何显示消息框?
- swift - 尽管在项目中识别了类,但核心数据没有找到生成的托管类
- angular - 如果网格的数据通过内联编辑进行编辑,则在 Ag-grid 中应用过滤器之前发出警报
- python - 高效匹配 Python 中的许多正则表达式?
- python - 谷歌protobuf和python中的多线程