1

By using the Bezier curve polyline draw function provided by nicoabie I was able to draw a curved line from one point on the map to another. The problem is that this function does not take in to account the fact that when a point is past the maximum coordinate mark it is not necessarily on the other side of the map, since it wraps around.

For example, drawing a curved line from Seattle to Tokyo. A regular polyline would go across the Pacific ocean, but the the curved line draws east across the whole globe.

geodesic: true does not work in this case since the line must have a consistent curvature.

My question is: can a consistently curved line be drawn that takes in to account map wrapping?

Community
  • 1
  • 1
RihardsPo
  • 151
  • 2
  • 11
  • Yes it can, what does your code look like? Can you provide a [Minimal, Complete, Tested and Readable example](http://stackoverflow.com/help/mcve) that exhibits the issue? – geocodezip Aug 27 '14 at 14:53
  • Have you tried adding a point to your curved line from Seattle to Tokyo on the international date line? – geocodezip Aug 27 '14 at 17:26

1 Answers1

3

Use the option third "nowrap" argument of the google.maps.LatLng class to force all the relevant points to have the same sign (set it to true, it defaults to false).

gmarkers[10].setPosition(new google.maps.LatLng(35.689488,139.69170)); // Tokyo
gmarkers[0].setPosition(new google.maps.LatLng(47.60621,(360-122.332071),true)); // Seattle
boundsCenter.setPosition(new google.maps.LatLng(36.096756,(360-178.986565),true)); // control point 1
gmarkers[6].setPosition(new google.maps.LatLng(48.511996,180)); // control point 2

var curvedLine = new GmapsCubicBezier(gmarkers[0].getPosition().lat(), gmarkers[0].getPosition().lng(), boundsCenter.getPosition().lat(), boundsCenter.getPosition().lng(), gmarkers[6].getPosition().lat(), gmarkers[6].getPosition().lng(), gmarkers[10].getPosition().lat(), gmarkers[10].getPosition().lng(), 0.01, map);

working fiddle

geocodezip
  • 158,664
  • 13
  • 220
  • 245