在bootstrap3模式中以谷歌地图为中心发布..不断变化

嗨，感谢您的帮助。我有一个引导程序3页面，我把谷歌地图放在一个模态中。经过大量的调整和研究，阅读后，我能够以桌面和移动格式正确地显示地图（地图填充模态无灰色，响应时不脱离模态等）。最后一个问题是，现在我发现渲染后中心标记不在帧内居中。也就是说，有时在页面重新加载后，地图会正确显示，有时，大多数情况下不会。这适用于Chrome、Firefox、Mozilla和Opera测试浏览器。请花了好几个小时在这个帮助上。

这是代码：

HTML

<!-- Google Map In Modal -->
            <!-- Button to trigger modal -->
            <p><a href="#mapmodals" data-toggle="modal" role="button" data-target="#mapModal" class="btn btn-primary"><b>Map to Satori Spa</b></a></p>  
            <!-- MAPS -->
            <div class="modal fade" id="mapModal" tabindex="-1" role="dialog" aria-labelledby="#mapModal" aria-hidden="true">
              <div class="modal-dialog modal-lg"">
                <div class="modal-content">
                  <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" style="color:#000;">Satori Spa Massage - Encino Ca.</h4>
                  </div>
                  <div class="modal-body">
                <div id="map-container"></div>
                  </div>
                  <div class="modal-footer">
                <button type="button" class="close" data-dismiss="modal">Close</button>
                  </div>
                </div><!-- /.modal-content -->
              </div><!-- /.modal-dialog -->
            </div><!-- /.modal -->

页面底部的JS

    <!-- Google Map In Modal -->
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script type='text/javascript'>
            var var_map;
            var var_location = new google.maps.LatLng(34.158540,-118.493270);
     function map_init() {          
            var var_mapoptions = {  
          center: new google.maps.LatLng( 34.158540, -118.493270 ),
              zoom: 11,
              mapTypeId: google.maps.MapTypeId.ROADMAP,
              mapTypeControl: true,
              panControl:false,
              rotateControl:false,
              streetViewControl: true,
            };
            var_map = new google.maps.Map(document.getElementById("map-container"),
                var_mapoptions);
          var contentString = 
                '<div id="mapInfo">'+
                '<p style=" font-size:12px; line-height:14px; color:#000;"><strong>Satori Spa Massage</strong><br>'+
                '16545 Ventura Blvd Suite 27<br>' +
                'Encino, California,<br>91436 USA<br>'+
                'P: (818) 907-9967</p>'+
                '<a href="http://www.satorispamassage.com" target="_blank">Plan your visit</a>'+
                '</div>';
          var var_infowindow = new google.maps.InfoWindow({
            content: contentString
          });
          var var_marker = new google.maps.Marker({
            position: var_location = new google.maps.LatLng(34.158540,-118.493270),
            map: var_map,
            title:"Click for information about the Satori Spa Massage in Encino",
                  maxWidth: 200,
                  maxHeight: 200
          });
          google.maps.event.addListener(var_marker, 'click', function() {
             var_infowindow.open(var_map,var_marker);
          });
      }
          google.maps.event.addDomListener(window, 'load', map_init);
      //start of modal google map
      $('#mapModal').on('shown.bs.modal', function () {
          google.maps.event.trigger(var_map, "resize");
          map.setCenter(new google.maps.LatLng(34.158540, -118.493270));
      initialize();
          });
</script>

直播页面在这里@satorismassage.com再次感谢，感谢您的帮助。