angularjs - Listening to `set_at` event using the ui-gmap-polygon -
i'm using drawingmanager
allow users draw shapes on map. once shape drawn, set listener on polygon's path can react after path has been changed:
var polygonpath = event.overlay.getpath(); google.maps.event.addlistener(polygonpath, 'set_at', function () { // code... });
this works great when user adds new shape using drawing tool. however, if have polygons in database displaying ui-gmap-polygon
angularjs directive (from angular-google-maps
project), how can listen set_at
event since event not on polygon, instead, on polygon's path (mvcarray)?
the place able find reference set_at
in source code of angular-google-maps
project in array-sync.coffee file, doesn't being exposed.
if can't listen set_at
event directly using directive, hope there event gets triggered when directive creates polygon can polygon's path , add listener that, code above.
i have put jsfiddle basic structure, along events object. handles polygon's mouseover , mouseout, not set_at
event.
give try below approach.
directive('uigmappolygon', function ($timeout) { return { restrict: 'e', link: function (scope, element, attrs) { // make sure polygon rendered before accessing it. // next 2 lines trick. $timeout(function () { // know properties $$ not use, can't away without using $$childhead scope.$$childhead.control.promise.then(function () { // polygons var polygons = scope.$$childhead.control.polygons; // iterate on polygons polygons.foreach(function (polygon) { // google.maps.polygon instance bound polygon var gobject = polygon.gobject; // paths of polygon var paths = gobject.getpaths(); // register 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, 'set_at', function () { console.log('set_at event'); }); }) }) }) }); } } })
Comments
Post a Comment