注意：

Question

HeJ小鼠。 Google地图在浏览器中显示为灰色，但可以在右下角看到标记和Google徽标。尝试过调整大小功能，但仍然没有工作。我正在使用bootstraps col。

我可以看到它在这里工作，但它没有谢谢你的帮助。

＆＃13;

function initialize() {
    
    var myOrigin = new google.maps.LatLng(56.63914, 9.79765);

    var mapProp = {
        center: myOrigin,
        zoom: 7,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);


    var myCenter = new google.maps.LatLng(56.157165, 10.207644);

    var marker = new google.maps.Marker({
        position: myCenter,
        title: 'Click to zoom'
    });

    marker.setMap(map);

    var myCenter2 = new google.maps.LatLng(57.04661, 9.924479);

    var marker2 = new google.maps.Marker({
        position: myCenter2,
        title: 'Click to zoom'
    });


    marker2.setMap(map);

    /*On marker click, it zooms to 19*/

    google.maps.event.addListener(marker, 'click', function () {
        map.setZoom(19);
        map.setCenter(marker.getPosition());
    });

    google.maps.event.addListener(marker2, 'click', function () {
        map.setZoom(19);
        map.setCenter(marker2.getposition());
    });

}

google.maps.event.addDomListener(window, 'load', initialize);

＆＃13;

#googleMap {
    height:350px;
    width:100%;
}

＆＃13;

<body>
  <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
    <div id="googleMap"></div>
  </div>
  <script src="http://maps.googleapis.com/maps/api/js"></script>
</body>

＆＃13;

Answer 1

如果您检查JavaScript的Getting Started：

<!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%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
async defer></script>
</body>
</html>

注意：

如果您在标准计划下使用API，则必须使用在您选择的项目中设置的浏览器密钥（一种API密钥）。详细了解API keys for the standard API。

谷歌地图显示灰色，但在调整浏览器大小时有效

1 个答案:

注意：