Question

我将谷歌地图称为引导程序面板。地图首次加载正常，第二次加载时不加载。我尝试调整地图和许多其他解决方案的大小，但它没有用。

我使用了以下文件1.Bootstrap JS 2.Bootstrap css和3.Jquery JS和UI

以下是代码

＆＃13;

var NirMap = document.getElementById('placeMap');

if (GBrowserIsCompatible()) {
  
  var map = new GMap2(NirMap);
  
  map.setCenter(new GLatLng(_lat, _long), 17);
  map.addControl(new GSmallMapControl());
  map.addControl(new GMapTypeControl());
  
}

var mapOptions = {
  
  center: new google.maps.LatLng( _lat, _long),
  zoom: 17,
  mapTypeId: google.maps.MapTypeId.ROADMAP
  
};

map = new google.maps.Map(NirMap, mapOptions);

google.maps.event.addDomListener(window, 'load', initialize);

＆＃13;

您可以在我的网站上查看问题，以获得更多分析 nirvanamrutam.com

Answer 1

Google maps API与第二次重新加载无关。我已经制作了一个演示功能的快速片段，点击“缩放”按钮，用随机缩放重新加载地图。但是，对于每次重新加载，您都需要创建一个新的地图对象。 View demo in JS Bin

<!DOCTYPE html>
<html>

<head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <style>
    html,
    body {
        height: 100%;
        margin: 0;
        padding: 0;
    }
    
    #map {
        height: 100%;
    }
    
    button {
        top: 10px;
        right: 10px;
        position: fixed;
        z-index: 999999;
    }
    </style>
</head>

<body>
    <div id="map"></div>
    <button onclick="initMap()">Zoom</button>
    <script>
    var map;

    function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
            center: {
                lat: -34.397,
                lng: 150.644
            },
            zoom: Math.floor(Math.random(10) * 10)
        });
    }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=&callback=initMap" async defer></script>
</body>

</html>

Google地图第二次加载时未加载

1 个答案: