Google地图API地图不会显示 [英] Google Maps API map doesn't appear

查看:112
本文介绍了Google地图API地图不会显示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

当我使用Google地图API时,无法显示我的地图。我正在尝试构建一个应用程序,并且它不会在那里工作,但是在我制作的这个测试页面中它也被破坏了。有人知道我做错了什么吗?

I can't get my map to appear when I'm using the Google Maps API. I am trying to build an application, and it won't work there, but it is also broken in this testing page I've made. Does anyone know what it is that I'm doing wrong?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
    console.log("Initializing...");
  var latlng = new google.maps.LatLng(-34.397, 150.644);
    var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"),
        myOptions);
}
</script>
</head>

<body onload="initialize()">
<div id="map_canvas" style="height: 100%; width: 100%;"></div>
</body>
</html>

感谢您的帮助。我很困惑!

Thanks for any help. I'm very confused!

推荐答案

给您的 map_canvas div一个固定的宽度和高度,你的例子将正常工作:

Give your map_canvas div a fixed width and height, and your example will work fine:

<div id="map_canvas" style="width: 500px; height: 400px;"></div>

否则,请将高度设置为您的 html body ,就像Google在 API教程

Otherwise, set the height to your html and body as Google does in the API tutorials:

<style type="text/css"> 
  html { height: 100% }
  body { height: 100%; margin: 0px; padding: 0px }
  #map_canvas { height: 100% }
</style> 

这篇关于Google地图API地图不会显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆