CODEWITHSUNDEEP
javascriptgoogle-mapsgoogle-maps-api-3
Sandeep Oberoi
Sandeep Oberoi

Reputation: 45

How to Plot Route on Google Maps

I am using the below code to Plot a Route

function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 3,
center: {lat: 0, lng: -180},
mapTypeId: google.maps.MapTypeId.TERRAIN
});

var flightPlanCoordinates = [
{lat: 37.772, lng: -122.214},
{lat: 21.291, lng: -157.821},
{lat: -18.142, lng: 178.431},
{lat: -27.467, lng: 153.027}
];
 var flightPath = new google.maps.Polyline({
path: flightPlanCoordinates,
geodesic: true,
strokeColor: '#FF0000',
strokeOpacity: 1.0,
strokeWeight: 2
});

flightPath.setMap(map);
}

Sample RouteCurrent Route

Using Polylines gives only Straight Lines is there any other method to Plot the Route as in the Sample Route Image. I have tried regarding but didn't got any such method

Upvotes: 0

Views: 1206

Answers (1)

Ted
Ted

Reputation: 126

Take a look here:
http://www.geocodezip.com/v3_polyline_example_arc.html
and here:
http://www.geocodezip.com/v3_polyline_example_rhumb.html

To do this you probably want to abstract the path over a sinusoid of some kind to make it more curvy and visually attractive. Check out the question below, there are a lot of in-depth answers.

Curved line between two near points in google maps

Upvotes: 1

Related Questions