GoogleMapsAPI基本2.ppt

Google Maps API 基 础(2) 谢健文 华南农业大学信息学院 4. Google Maps API 地图控件 地图控件概述 向地图添加控件 在地图上放置控件 定制地图控件 地图控件概述 地图上允许用户与地图交互的 UI 元素，称为控件。 Google maps API 带有大量可以在地图中使用的内置控件： GLargeMapControl - 在 Google 地图上使用的大型平移/缩放控件。默认情况下位于地图的左上角。 GSmallMapControl - 在 Google 地图上使用的小型平移/缩放控件。默认情况下位于地图的左上角。 GSmallZoomControl - 在 Google 地图上用于显示行车方向的小地图弹出窗口中使用的小型缩放控件（无平移控件）。 GScaleControl - 地图比例尺 GMapTypeControl - 使用户可以切换地图类型（如“地图”和“卫星”）的按钮。 GHierarchicalMapTypeControl - 用于放置多个地图类型选择器的嵌套按钮选项和菜单项。 GOverviewMapControl - 位于屏幕一角，可折叠的缩略图。 所有这些控件都基于 GControl 对象 地图控件示例 向地图添加控件 使用 GMap2 方法 addControl() 向地图添加控件。 向地图添加控件 在地图上放置控件 addControl 方法有一个可选的第二参数 GControlPosition，可用于指定该控件在地图上的位置。它可以是以下值之一，这些值分别指定要放置控件的地图某个角： G_ANCHOR_TOP_RIGHT G_ANCHOR_TOP_LEFT G_ANCHOR_BOTTOM_RIGHT G_ANCHOR_BOTTOM_LEFT 如果不包含此参数，则地图 API 将使用控件指定的默认位置。 GControlPosition（可选）可以指定一个偏移值，表示放置的控件与地图边相距多少像素。该偏移值使用 GSize 对象指定。 在地图上放置控件 var map = new GMap2(document.getElementByIdmap_canvas)); map.setCenter(new GLatLng(39.917,116.397 ), 14); var smallMapControl = new GsmallMapControl (); var topRight = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(10,10)); var bottomRight = new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,10)); map.addControl(smallMapControl, topRight); GEvent.addListener(map, dblclick, function() { ? map.removeControl(smallMapControl); ? map.addControl(new GsmallMapControl (), bottomRight); }); 在地图上放置控件 定制地图控件 通过创建 GControl 的子类定制地图控件。（将 prototype对象分配给 GControl 对象的实例 : XCtotype=new GContorl） 至少为该类定义以下两个方法：initialize() 和 getDefaultPosition()。initialize() 方法必须返回 DOM 元素，而 getDefaultPosition() 方法必须返回类型为 GControlPosition 的对象。 所有地图控件均应添加到地图容器(Container)， 后者可以通过 GMap2 的 getContainer() 方法访问。 5. Google Maps API 地图叠加层 地图叠加层概述 标记 可拖拽标记 图标 定制图标 标记管理器 折线 绘制折线 测地折线 编码折线 多边形 底面叠加层 图块叠加层 图块层叠加层 定制地图类型 图块探测器 地图叠加层概述 叠加层 (Overlay) 是地图上绑定到经度/纬度坐标的对象，会随您拖动或缩放地图而移动。叠加层表现为“添加”到地图上以指明点、线或区域的对象。 地图 API 有如下几种叠加层： 标记 (Marker)：经常显示定制图标。标记是类型为 GMarker 的对象，可以使