[英]Google Maps Places API Map not showing up
I just started working with the google maps places API and have been able to pull together this code but the map doesn't show up. 我刚刚开始使用Google Maps Places API,并且能够将这些代码组合在一起,但未显示地图。 I would imagine it is a small error somewhere but I can't find it.
我可以想象这是一个小错误,但我找不到。 If anyone could point it out that would be a huge help and also is there anywhere online or any free IDEs that are good for catching errors like this?
如果有人可以指出这将是巨大的帮助,并且在任何地方都可以找到在线或免费的免费IDE,以捕获此类错误?
Code: http://jsbin.com/ifuwel/1/edit 代码: http : //jsbin.com/ifuwel/1/edit
You have 2 different IDs ("map" and "map_canvas"). 您有2个不同的ID(“地图”和“ map_canvas”)。 Try that:
试试看:
map = new google.maps.Map(document.getElementById('map_canvas'), {
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: pyrmont,
zoom: 15
});
Try this basic example 试试这个基本的例子
HTML 的HTML
<body onload="initialize()">
<div id="map_canvas"></div>
</body>
Javascript Java脚本
<script>
function initialize() {
var mapOptions = {
zoom: 4,
center: new google.maps.LatLng(-33, 151),
panControl: false,
zoomControl: false,
scaleControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map_canvas'),
mapOptions);
}
</script>
CSS 的CSS
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map_canvas {
height: 100%;
}
@media print {
html, body {
height: auto;
}
#map_canvas {
height: 650px;
}
}
</style>
CSS help to have 100% of the width and height if desired 如果需要,CSS可以帮助实现宽度和高度的100%
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.