angularjs – 使用ui-gmap-polygon侦听`set_at`事件

发布时间：2020-12-17 06:54:07 所属栏目：安全来源：网络整理

导读：我目前正在使用DrawingManager来允许用户在地图上绘制形状.绘制一个形状后,我在多边形的路径上设置了一个监听器,这样我可以在路径改变后做出反应： var polygonPath = event.overlay.getPath();google.maps.event.addListener(polygonPath,'set_at',function

我目前正在使用DrawingManager来允许用户在地图上绘制形状.绘制一个形状后,我在多边形的路径上设置了一个监听器,这样我可以在路径改变后做出反应：

var polygonPath = event.overlay.getPath();
google.maps.event.addListener(polygonPath,'set_at',function () { 
    // my code...
});

当用户使用绘图工具添加新形状时,这非常有用.但是,如果我在我的数据库中已经使用ui-gmap-polygon AngularJS指令显示多边形(来自angular-google-maps项??目),我怎么能听到set_at事件,因为此事件不在polygon上,而是在多边形的路径上(MVCArray)？

我能够在angular-google-maps项??目的源代码中找到对set_at的引用的唯一地方是在array-sync.coffee文件中,但它看起来不像是暴露的.

如果我不能直接使用指令监听set_at事件,我希望有一个事件在指令创建多边形时被触发,这样我就可以得到多边形的路径然后添加一个监听器,就像上面的代码.

我已经将JSFiddle与基本结构以及事件对象放在一起.它当前处理多边形的mouSEOver和mouSEOut,但不处理set_at事件.

解决方法

尝试使用以下方法.

directive('uiGmapPolygon',function ($timeout) {
  return {
    restrict: 'E',link: function (scope,element,attrs) {

      // Make sure that the polygon is rendered before accessing it. 
      // next two lines will do the trick.
      $timeout(function () {
        // I know that properties with $$are not good to use,but can't get away without using $$childHead
        scope.$$childHead.control.promise.then(function () {
          // get the polygons
          var polygons = scope.$$childHead.control.polygons;
          // iterate over the polygons
          polygons.forEach(function (polygon) {
            // get google.maps.Polygon instance bound to the polygon
            var gObject = polygon.gObject;

            // get the Paths of the Polygon
            var paths = gObject.getPaths();
            // register the events.
            paths.forEach(function (path) {
              google.maps.event.addListener(path,'insert_at',function () {
                console.log('insert_at event');
              });

              google.maps.event.addListener(path,'remove_at',function () {
                  console.log('remove_at event');
              });

              google.maps.event.addListener(path,function () {
                  console.log('set_at event');
              });
            })
          })
        })
      });
    }
  }
})

Working Plnkr

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!