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:
This is the map generated by the static API:
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!
The bound of the polygon is exactly the path you gave it:
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
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.
User contributions licensed under CC BY-SA 3.0