Javascript 如何在同一div id上刷新google地图

我做了一个实验，用bootstrap创建了多张卡片，每张卡片上都有一个按钮，可以在bootstrap模式下显示面板内部的简单谷歌地图

在html方面，每个按钮都具有数据属性，用于传递要在同一模态div上呈现的经度和纬度数据

<a href="#" class="btn btn-md" data-toggle="modal" data-frame="iframe" data-target="#workshopModal" data-theVideo="https://www.youtube.com/embed/1KOBVZMJkgY" data-lat="-6.349931" data-lng="106.899435" >Detail</a>

<a href="#" class="btn btn-md" data-toggle="modal" data-frame="iframe" data-target="#workshopModal" data-theVideo="https://www.youtube.com/embed/W3qoutZ_mEs" data-lat="-7.349931" data-lng="107.899435" >Detail</a>

---

你能用工作示例创建一个JSFIDLE吗？很抱歉我提出了一个愚蠢的问题，我已经找到了解决方案，它非常简单，只需从var lat和var lng中删除var，它的工作：））

$(document).ready(function(){
      function initialize(lat,lng) {
        var mapProp = {
          center:new google.maps.LatLng(lat, lng),
          zoom:15,
          scrollwheel:false,
          draggable:false,
          mapTypeId:google.maps.MapTypeId.ROADMAP
        };

        var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);

        var marker = new google.maps.Marker({
          position:new google.maps.LatLng(lat, lng),
        });

        marker.setMap(map);

        //google.maps.event.addDomListener(window, 'load', initialize);
        /*google.maps.event.addListener(marker, 'click', function() {
          var_infowindow.open(map,marker);
        });*/
      }




      function loadingModal(){
        var trigger = $("body").find('[data-toggle="modal"]');
        trigger.click(function() {
          var theFrame = $(this).data( "frame" );
          var theModal = $(this).data( "target" );

          var lat = parseFloat($(this).attr("data-lat"));
          var lng = parseFloat($(this).attr("data-lng"));
          videoSRC = $(this).attr( "data-theVideo" );

          $("[id*=workshopModal]").on('hidden.bs.modal', function () {
            $("[id*=workshopModal] "+ theFrame).removeAttr('src');
            //google.maps.event.clearListeners(map, 'bounds_changed');
            $('.panel-collapse.in').collapse('hide');
            $('.panel-collapse:not(".in")').collapse('hide');
          });

          $("#workshopModal").on("shown.bs.collapse", function () {
            alert(lat+' '+lng+' '+videoSRC);
            initialize(lat,lng);
            google.maps.event.addDomListener(window, 'load', initialize);
            google.maps.event.trigger(map, "resize");
          });


        });
      }

      loadingModal();
    });