zoukankan      html  css  js  c++  java
  • Google Maps API 进级: GoogleMaps常用事件及应用思路2

    转自:http://hi.baidu.com/xfm_zhr/blog/item/7bb88c19139de94242a9ad2b.html

    GMarker的单击,双击以及拖动效果

    注意:默认创建的GMarker是无法拖动的,必须在GMarker创建时在GmarkOptions里激活该功能,即将GmarkerOptions的draggable设为true,通常同时设定bouncy和bounceGravity属性改变拖放的效果。

    关于双击事件。默认双击行为是双击的位置设为地图中心。可用GMap2.doubleClickZoomEnabled()等方法屏蔽默认的操作。

    示例代码:

        GMarker.prototype.setIndex = function(index)

             {

                this.index = index;

             }   

            var markers = [];

        //通过复制产生

        var myIcon= new GIcon(G_DEFAULT_ICON, "http://www.google.com/mapfiles/marker.png");

       

        //创建地标

        function createMarker(point)

        {

          var marker = new GMarker(point, {icon: myIcon, draggable: true, bouncy: true});

          var index = markers.length;

         

          //双击地标删除该地标

          GEvent.addListener(marker, 'dblclick', function()

                              {

                                deleteMarker(marker);

                              });

         

          //dragstart事件,换新图标

          GEvent.addListener(marker, 'dragstart', function()

                              {

                                marker.setImage("http://www.google.com/mapfiles/dd-start.png");

                              });

          //dragend事件,换回原图标

          GEvent.addListener(marker, 'dragend', function()

                              {

                                marker.setImage("http://www.google.com/mapfiles/marker.png");

                              });

         

          //单击显示形成安排

          GEvent.addListener(marker, 'click', function()

                             {

                                marker.openInfoWindowHtml("干些什么呢?");

                              });

                             

          //drag事件

          //注意,如果添加了polyline,则拖动地标时需要重画路线

          GEvent.addListener(marker, 'drag', function()

                             {

                                redrawPolyline();

                              });

         

          marker.setIndex(index);

          markers[index] = marker;

          map.addOverlay(marker);

         

          //每创建一个新的地标就重画一次

          redrawPolyline();

        }

       

        //双击地标删除该地标

        function deleteMarker(marker)

        {

          //确定是否真的删除

          if(!confirm("确定删除该地标吗?")) return;

         

          var index = marker.index;

         

          //移除该图层

          map.removeOverlay(marker);

         

          //从数组中删除指定GMarker并更新index

          for(var i = index; i<markers.length-1; i++)

          {

              markers[i+1].setIndex(i);

              markers[i] = markers[i+1];

          }

          markers.length = markers.length-1;

        }

       

        function load()

        {

          if (GBrowserIsCompatible())

          {

            map = new GMap2(document.getElementById("map"));

            map.addControl(new GSmallMapControl());

            map.addControl(new GMapTypeControl());

           

            var centerPoint= new GLatLng(39.92, 116.46);

           

            map.setCenter(centerPoint, 4);

           

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

                             {

                               if(point) createMarker(point);

                             });

          }

        }

       

        //添加行程路线

        function addPolyline()

        {

          //创建

          var points = [];

          for(var i=0; i<markers.length; i++)

          {

            points[i] = markers[i].getPoint();

          }

         

          polyline = new GPolyline(

            points, //GLatLng()数组

            "#FF0000", //折线颜色

            10, //折线宽度

            0.5 //透明度

            );

          map.addOverlay(polyline);

        }

       

        //删除行程路线

        function removePolyline()

        {

          polyline.remove();

          polyline = null;

        }

       

        //重画行程路线

        function redrawPolyline()

        {

          if(polyline)

          {

            removePolyline();

          }

          addPolyline();

    }

  • 相关阅读:
    判别模型、生成模型与朴素贝叶斯方法
    git的安装已经连github
    uva 10061 How many zero's and how many digits ?
    Java菜鸟学习笔记()--面向对象篇(七):Wrapper Class包装类
    丁香园技术负责人冯大辉近日在知乎上披露了当年共同创办阿里巴巴的18个合伙人的近况:
    不用派生CTreeCtrl不用繁琐的过程 教你如何让CTreeCtrl的每一项有ToolTip提示
    数据结构排序系列详解之三 冒泡排序
    HDU 4612 (13年多校第二场1002)无向图缩点,有重边
    Mac下cocos2dx3.1用Cocos IDE写的Lua binding篇01
    SECURITY_ATTRIBUTES 设置低权限
  • 原文地址:https://www.cnblogs.com/wangpei/p/1626970.html
Copyright © 2011-2022 走看看