javascript - Google map polygon with outside map tinted -
this question has answer here:
first of all, issue you're going read, used snippet of code highlight polygon : highlight polygon , tint rest of map using google maps
here code (it's angular) :
var boundaries = []; // big area var overlay = [ new $rootscope.googleapi.latlng(80.0, -90.0), new $rootscope.googleapi.latlng(-60.0, -90.0), new $rootscope.googleapi.latlng(-60.0, 90.0), new $rootscope.googleapi.latlng(80.0, 90.0) ]; // polygon angular.foreach(settings_boundaries, function(val, key) { boundaries.push(new $rootscope.googleapi.latlng(val[1], val[0])); }); // create polygon overlay first var poly = new $rootscope.googleapi.polygon({ paths: [overlay, boundaries], strokecolor: "blue", strokeweight: "1", fillcolor: "black", fillopacity: 0.4, clickable: false }); poly.setmap(interactivemap);
now, real problem is, if use these coordinates (which don't remember how got them in first place) :
[[1.6101837158203125,49.00274483644452], [1.6294097900390625,49.01175312475694], [1.5947341918945312,48.98787759766659], [1.6101837158203125,49.00274483644452]]
everything works fine (as can see here).
but if use these ones :
[[1.6809940338134766,48.98337149775796], [1.6791915893554688,48.96849847697763], [1.7185020446777344,48.995199140974066], [1.6809940338134766,48.98337149775796]]
this not working anymore.
can see here.
i used website generate coordinates :
http://www.the-di-lab.com/polygon/ (view screenshot)
i searched long time issue be, have no idea. it's approximately same coordinates. first lat,lon values same last ones, both of them.
if have idea (i guess there's special in coordinates), know !
thanks !
structurally, coordinates of triangle correct. geometrical difference first triangle (the 1 functioning) drawn in clockwise direction while latter drawn counterclockwise. have met situation not remember site. try reverse direction of drawing of triangle in way:
[[1.6809940338134766,48.98337149775796], [1.7185020446777344,48.995199140974066] [1.6791915893554688,48.96849847697763] [1.6809940338134766,48.98337149775796]]
Comments
Post a Comment