Google Maps API 进级： GoogleMaps常用事件及应用思路1

转自： http://hi.baidu.com/xfm_zhr/blog/item/8c1790517e87ea888d54302a.html

1.       GoogleMaps常用事件及应用思路

地图再被鼠标拖动时，GMap2对象会激发dragstart,drag,dragend等事件。

示例：动态显示地图的中心位置。

    //更新信息，el为指定HTML元素，info为里边显示的内容

    function updateInfo(el, info)

    {

      el.innerHTML = info;

    }

   

    //添加拖动事件监听器

    function addDragListener()

    {

       //监听地图上的事件

       GEvent.addDomListener(map, 'dragstart', function()

                    {

                        updateInfo(eventinfo, "当前事件：dragstart");

                    });

       GEvent.addDomListener(map, 'drag', function()

                    {

                        updateInfo(eventinfo, "当前事件：drag");

                        updateInfo(mapcenter, "当前地图中心纬度：" + map.getCenter().lat() + " 经度" + map.getCenter().lng());

                    });

       GEvent.addDomListener(map, 'dragend', function()

                    {

                        updateInfo(eventinfo, "当前事件：dragend");

                    });

}

地图缩放是，GMap2激发zoomstart和zoomend事件。

示例：动态获取地图缩放级别

    //添加缩放事件监听器

    function addZoomListener()

    {

       //监听地图上的缩放事件

       GEvent.addDomListener(map, 'zoomstart', function()

                    {

                        updateInfo(eventinfo, "当前事件：zoomstart");

                    });

       GEvent.addDomListener(map, 'zoomend', function()

                    {

                        updateInfo(eventinfo, "当前事件：zoomend");

                        updateInfo(zoomlevel, "当前地图缩放级别：" + map.getZoom());

                    });

}

 

地图类型发生改变，GMap2会激发maptypechanged事件。

示例：动态获取地图类型。

    //添加maptypechanged事件监听器

    function addMapTypeListener()

    {

       //监听地图上maptypechanged事件

       GEvent.addDomListener(map, 'maptypechanged', function()

                    {

                        updateInfo(eventinfo, "当前事件：maptypechanged");

                        updateInfo(maptype, "当前地图类型：" + map.getCurrentMapType().getName(false));

                    });

}

 

单击Google地图，GMap2会激发click事件。注意：该事件包含两个参数：overlay，point。

示例：获取鼠标位置，并添加GMarker对象。

        GEvent.addListener(map, 'click', function(overlay, point)

                         {

                           if(point)

                           {

                             var marker = new GMarker(point);

                             map.addOverlay(marker);

                           }

                         });