Google Maps Static API not rendering last path of polygon

0

I have a software that allows users to define certain boundaries in a map. In order to accomplish that I use the drawing functionality of GoogleMaps. Once the user's finished drawing the boundaries I get and encode the path to store it. If I edit that same record, it works perfectly. The boundaries are correctly generated. I decode the encoded path and set it to a bounds variable that generates the drawing on the map. But if I try to send the exact same path to Google Maps Static API, it doesn't work. The last path is always blank.

This is the code used to load the encoded path into the map using the regular API (it is working properly):

let bounds = new google.maps.LatLngBounds();
let decodedArray = google.maps.geometry.encoding.decodePath(EncodedPath);
this.selectedOverlay = new google.maps.Polygon({ paths: decodedArray });

this.selectedOverlay.setMap(this.map);
this.selectedOverlay.getPath().forEach((element: google.maps.LatLng) => {
    bounds.extend(element);
});
this.map.setCenter(bounds.getCenter());

This is the map generated by the regular API: enter image description here

This is the map generated by the static API: enter image description here

This is the URL to generate the map:

https://maps.googleapis.com/maps/api/staticmap?key=[api_key_here]&size=709x470&path=weight:2|fillcolor:0x00000040|color:0x000000aa|enc:ebxwFnxsbMbGxDpFwPkG{D

As you can see the last path is blank. I tested with several different polygons, all with the same result! The last path is always blank...

Any ideas on how to fix that?

I've read a lot of questions here but most (if not all) were related to a double backslash, which is not my case (see the generated URL).

Thanks!

google-maps
google-maps-api-3
google-static-maps
asked on Stack Overflow Feb 2, 2018 by eestein • edited Feb 2, 2018 by eestein

1 Answer

1

The bound of the polygon is exactly the path you gave it:

encoded path

If you want it to enclose the array, make a closed path:

https://maps.googleapis.com/maps/api/staticmap?size=709x470&path=weight:2|fillcolor:0x00000040|color:0x000000aa|enc:ebxwFnxsbMbGxDpFwPkG{DiFxP

static map with full path

The solution was one answer from 2013: Polygons are not closed

As commented, adding the first item of the polygon as the last one fixes the issue.

answered on Stack Overflow Feb 2, 2018 by geocodezip • edited Feb 3, 2018 by eestein

User contributions licensed under CC BY-SA 3.0