【问题标题】:Bootstrap modal is not opening on Google Maps marker click引导模式未在谷歌地图标记点击上打开
【发布时间】:2019-11-04 03:42:29
【问题描述】:

我尝试了几个选项,但都没有成功。我的主要目标是打开一个带有位置信息的 Bootstrap modal.centered。我试图将触发按钮放到 infoWindow 上,但是当我点击它时,页面只显示灰色的半透明背景。我做了一个简单的地图,我试图测试。

My codepen: https://codepen.io/ilja-ankipovits/pen/QWWQyqK

我只添加了模式的开头和整个 Google 地图脚本。 我是 google API 的新手,所以欢迎补充说明。

【问题讨论】:

标签: javascript twitter-bootstrap google-maps bootstrap-modal


【解决方案1】:

对于所有陷入理智问题的人,充满爱:):

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>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-07-23
    • 2023-03-16
    • 2012-09-27
    • 1970-01-01
    • 2016-06-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多