google地图之pi介绍.doc

Google Maps JavaScript API V3 辅导手册 注意：以下网页中提到的 Google Maps JavaScript API 第 3 版现在是正式的 JavaScript API 版本。该 API 的第 2 版已根据我们的弃用政策正式弃用。欢迎您将代码移植到这个功能更强、最近更新的版本中！ 简介 Google Maps 的“世界，您好” 载入 Google Maps API 第 3 版 地图 DOM 元素 地图选项 google.maps.Map - 基本对象 载入地图 纬度和经度 地图类型 简介 任何 Google Maps 第 3 版 API 应用程序中的基本元素都是“地图”本身。本文介绍了 google.maps.Map 基础对象的用法和地图操作的基础知识。（如果您已经学习了第 2 版的辅导手册，您会发现，这两版辅导手册中的很多内容都是相同的。但两者之间也会有些区别，因此，请仔细阅读本文。） Google Maps 第 3 版的“Hello, World” 初步了解 Google Maps API 的最简单方法就是看一个简单的示例。以下网页显示了以澳大利亚新南威尔士的悉尼为中心的一个地图： html?head?meta name=viewport content=initial-scale=1.0, user-scalable=no /?script type=text/javascript src=/maps/api/js?sensor=set_to_true_or_false/script?script type=text/javascript?? function initialize() {?? ? 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=width:100%; height:100%/div?/body?/html 查看示例 (map-simple.html) 即使在这个简单的示例中，也有几点需要注意： 使用 script 标记来加入 Maps API JavaScript。 我们创建一个名为“map_canvas”的 div 元素来承载该地图。 创建 Javascript 对象常量以保存若干地图属性。 编写 Javascript 函数以创建“map”对象。 我们从 body 标记的 onload 事件初始化该地图对象。 下文说明了这些步骤。 载入 Google Maps API? html?head?meta name=viewport content=initial-scale=1.0, user-scalable=no /?script type=text/javascript src=/maps/api/js?sensor=set_to_true_or_false/script /maps/api/js 网址指向 Javascript 文件所在的位置，该文件会载入使用第 3 版 Google Maps API 所需的全部符号和定义。您的网页必须包含指向该网址的 script 标签。 此标头中的 meta 标签会指定如下内容：即应当以全屏模式显示该地图，且用户不能调整地图尺寸。（有关详细信息，请参见开发移动设备部分。） 请注意，我们还需要设置 sensor 参数，以指明此应用程序是否使用传感器确定用户的位置。在此示例中，我们将该参数设为变量“set_to_true_or_false”，用于强调您必须将该值显式设为 true 或 false。 地图 DOM 元素 div id=map_canvas style=width: 100%; height: 100%/div 要在网页上显示地图，我们必须为其留出一个位置。通常，我们的做法是创建一个名为 div 的元素，然后在浏览器的文档对象模型 (DOM) 中获取此元素的引用。 在上述示例中，我们定义了名为“map_canvas”的 div 并使用样式属性设置其大小。请注意，该尺寸已设置为“100％”，这