Google Maps Api V3 Polygon Closing

When creating a polygon using the Google Maps API v3, how can I prevent the polygon from snapping to other 'maps'? So instead of: I would like to make the polygon close like this:

Solution 1:

The issue occurs when the difference between the longitudes of 2 consecutive points in the path is >=180

the longitudes of the first 2 points are -97 and 93, so that's the problem in this case(difference is 190)

The only thing I may suggest so far is to split this portion of the path:

new google.maps.LatLng(81, -97),
//additional pointnew google.maps.LatLng(80.5, -12),
new google.maps.LatLng(80, 93),
new google.maps.LatLng(56, 78),
new google.maps.LatLng(60, -94)

Demo: http://jsfiddle.net/doktormolle/39CtV/

Solution 2:

Once I also Needed it , and thankfully Devs had provided there Research ,so i'm sharing With you

//Taking Example of Bermuda Trianglefunctioninitialize() {
var mapOptions = {
zoom: 5,
center: new google.maps.LatLng(24.886436490787712, -70.2685546875),
mapTypeId: google.maps.MapTypeId.TERRAIN
};

var bermudaTriangle;

var map = new google.maps.Map(document.getElementById('map-canvas'),
  mapOptions);

// Define the LatLng coordinates for the polygon's path.var triangleCoords = [
new google.maps.LatLng(25.774252, -80.190262),
new google.maps.LatLng(18.466465, -66.118292),
new google.maps.LatLng(32.321384, -64.75737),
new google.maps.LatLng(25.774252, -80.190262)
];

// Construct the polygon.
bermudaTriangle = new google.maps.Polygon({
paths: triangleCoords,
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35
});

bermudaTriangle.setMap(map);
 }

google.maps.event.addDomListener(window, 'load', initialize);

For More Reference

https://developers.google.com/maps/documentation/javascript/examples/polygon-simple