Can polygon.setPath(); be used to completely redefine polygon?

Question

Google Maps JavaScript API V3.

My mapping has me dealing with the idea of polygons, and I'm trying to develop a strategy before I dive into the code.

I'm never going to have more than one polygon on the map at a time, so I'm hoping I can define one polygon and reuse it as you can with markers.

Is my understanding correct that the polygons setPath(); function will move the polygon to represent a new array of points? The documentation says... "Inserting or removing LatLngs from the MVCArray will automatically update the polygon on the map." but it doesn't come right out and say that you can use setPath(); to give it an entirely new array of points.

I'm thinking in psuedocode...

// some event fires
polygon.setPath(latlngArray);
bounds = new google.maps.LatLngBounds();
$.each(latlngArray, function(key, ll){
  bounds.extend(ll);
});
polygon.setMap(MyMap);
MyMap.fitBounds(bounds);

//a different event fires
polygon.setMap(null);
// build a new latlngArray
// do it again

Am I correct in thinking that I can reuse the same polygon object in this fasion, or do I need to rethink my strategy?

Thanks.

Skip

EDIT: The answer is yes it can. I'm going to hash out my code better and try to provide a well written answer, that shows the caveats I've come across. Such as, the map must be visible for map.fitBounds(); to give cogent results.

Answer 1

Yes it is quite possible to reuse the same polygon object...

I really don't have any code to offer. The psuedocode I listed in the question basically works.

These are the things I learned or chose in fleshing out my solution...

As stated earlier, the map can't be style="display: none;" for map.fitBounds(); to work as expected.

I already keep a container object that holds my markers. I created a container object for the polygon paths, and add a 'polygon' attribute to markers that are associated with a polygon, so multiple markers can reference the same polygon path.

Even for polygons with a single path, I chose to embed my path array, within another array, then use polygon.setPaths(); This way the code will scale easier if I expand to polygons with multiple paths.

When initially parsing the polygon path build a LatLngBounds object, and then save its bounds.getSouthWest(); & bounds.getNorthEast(); along with the path. This allows for quick and easy map.fitBounds(); at display time, and keeps from recalculating the same bounds multiple times.

Anyhow, yes it is certainly possible, and I think quite efficient to reuse the same polygon object with different paths.

San Francisco & Oakland recycling the same polygon object...

That's all i got!

Skip

UPDATE: I found some polygon data with multiple paths. It plugged right in.

Answer 2

yes, you are both correct in your assumption that redefining the setPaths will redefine the polygon, BUT you must setMap afterwards for the polygon to be redrawn. the polygon may be outside the api window, that is irrelevant. for ease of use, once "repointed", since the polygon may be outside your viewing window, it would be good USABILITY practice to redefine the center of the window using the setCenter method on the map. This code is a chunk that i removed from an application that allows users to draw a polyline and then convert it into a polygon (since user may want to fix perimeter, i allow her to go back and forth between polyline and polygon). i always use the same polygon and simply setPathSSSSSSSSS (there is an S in the end for polygons):

function confirmClosePolyline() {
    var pathArrayTemp = areaPerimeterPath.getPath();
    var decision = confirm("Change POLYGON?");
    if (decision) {
        areaMapPolygon.setMap(null); //makes polygon "invisible"/ removes
        areaMapPolygon.setPaths(pathArrayTemp);
        areaMapPolygon.setMap(map);
    }
}