我试图把显示地图(< div id =“map-canvas”>< / div>)的div标签放在另一个div，但它不显示地图的方式。是CSS还是JavaScript问题？还是只是API的工作原理？
这里是我的代码与嵌套的div：
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<Meta name="viewport" content="initial-scale=1.0,user-scalable=no">
<Meta charset="utf-8">
<style>
html,body,#map-canvas {
margin: 0;
padding: 0;
height: 100%;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false">
</script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 8,center: new google.maps.LatLng(-34.397,150.644),mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);
}
google.maps.event.addDomListener(window,'load',initialize);
</script>
</head>
<body>
<div> <!-- ommiting this div will show the map -->
<div id="map-canvas"></div>
</div>
</body>
</html>
解决方法
添加style =“width：100％; height：100％;”到div看看是什么
不是#map_canvas，而是主div
例
<body>
<div style="height:100%; width:100%;">
<div id="map-canvas"></div>
</div>
</body>
这里有一些其他的答案解释为什么这是必要的
