Since Google Maps v3.11 it's possible to drag around polygons by setting the `draggable` property to `true`: http://www.bram.us/2013/02/15/google-maps-v3-draggable-polygon/
If you want to programmatically move them though, you'll need to use a Google Maps Extension which I wrote, as the API does not provide such a method: http://www.bram.us/2013/02/16/google-maps-v3-move-polygon/ Regards, Bramus. On Monday, February 28, 2011 12:55:04 PM UTC+1, Frederic Vernier wrote: > > I finally succeed to have polygons drag&drop behavior in google maps. > > The way I did : > -1- the map MUST be draggable in its initial options (even if it is the > polygon I will drag) > -2- polygon callback must then prevent the map from panning (saving the > center at mousedown and re-affecting this center at every mousemove) > -3- register mousemove and mouseup on both map and polygon(s), you never > know where the pointer will be due to the lag > -4- re-compute every point of the polygon at every mouvemove by offsetting > them > (js code follows) > > However I'm not very happy with performances. It may be due to item #4 but > has impact on item #3. Also when you drag the polygon outside the map and > then re-entering the map, there is a strange shaking of the map. At last > when I zoom-unzoom with the mouse wheel in the middle of a drag, there is a > little > re-offseting at the first move after the zoom (since saved map center do > not correspond well to the new zoomed map). > > My question : does someone better resolved the dragging polygon problem ? > > My wish list for googlers > -1- event triggered on polygon even if the map is not draggable > -2- a mechanism to have the polygon receiving all the events when it is > dragged > -3- a way to offset all the polygon points at the same time (and then a > way to link a polygon with something else in the MVCObject archi. model) > -4- a way to have color gradients inside polygons (well it's not santa's > wish list maybe.... ;-) > > // GLOBAL VARS > var grabPoly; > var grabPolyLoc; > var grabMapLoc; > > > > > // SOMEWHERE IN MY CODE > var polyOptions = { > strokeColor: '#0000FF', > strokeOpacity: 0.6, > strokeWeight: 1, > clickable: true > } > var poly0 = new google.maps.Polygon(polyOptions); > path0 = new google.maps.MVCArray(); > path0.push(new google.maps.LatLng(48.24370129200754,1.3039131164550781)); > path0.push(new google.maps.LatLng(47.50681416405265,3.720905303955078)); > path0.push(new google.maps.LatLng(46.96975999867877,1.8532295227050781)); > poly0.setPath(path0); > poly0.setMap(map); > > google.maps.event.addListener(poly0,'mousedown',function(evt){ > grabPoly = this; > grabPolyLoc = evt.latLng; > grabMapLoc = map.getCenter(); > }); > > google.maps.event.addListener(poly0,'mouseup',function(evt){ > if (grabPoly!=null) { > grabPoly = null; > } > }); > google.maps.event.addListener(poly0,'mousemove',function(evt){ > if (grabPoly != null){ > map.setCenter(grabMapLoc); > var path1 = new google.maps.MVCArray(); > for (var j=0; j<grabPoly.getPath().getLength(); j++) { > var pt = grabPoly.getPath().getAt(j); > var newlon = pt.lng()+evt.latLng.lng()-grabPolyLoc.lng(); > var newlat = pt.lat()+evt.latLng.lat()-grabPolyLoc.lat(); > path1.push(new google.maps.LatLng(newlat, newlon)); > grabPoly.getPath().setAt(j, new google.maps.LatLng(newlat, > newlon)); > } > grabPoly.setPath(path1); > grabPolyLoc = evt.latLng; > } > }); > > google.maps.event.addListener(map,'mousemove',function(evt){ > if (grabPoly != null){ > map.setCenter(grabMapLoc); > var path1 = new google.maps.MVCArray(); > for (var j=0; j<grabPoly.getPath().getLength(); j++) { > var pt = grabPoly.getPath().getAt(j); > var newlon = pt.lng()+evt.latLng.lng()-grabPolyLoc.lng(); > var newlat = pt.lat()+evt.latLng.lat()-grabPolyLoc.lat(); > path1.push(new google.maps.LatLng(newlat, newlon)); > grabPoly.getPath().setAt(j, new google.maps.LatLng(newlat, > newlon)); > } > grabPoly.setPath(path1); > grabPolyLoc = evt.latLng; > } > }); > > google.maps.event.addListener(map, 'mouseup', function(){ if (grabPoly != > null) grabPoly = null; }); > -- You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en. For more options, visit https://groups.google.com/groups/opt_out.
