ASPForums.Net RSS Feedhttp://www.aspforums.net/Handlers/RSS.ashxLatest additions to the content that appears on ASPForums.Net(c) 2019 www.aspforums.com. All rights reserved.Google Map API: Draw single route line on Map from start location to end location<p>Don't push the src point on to the path out of order (the directions service is asynchronous).</p> <p>Remove this line:</p> <pre class="brush: js">path.push(src);</pre> <p>And change the code to render each directions result as a separate polyline.</p> <p>And change the script for ROUTING like below. </p> <pre class="brush: js">//***********ROUTING****************// //Initialize the Direction Service var service = new google.maps.DirectionsService(); //Loop and Draw Path Route between the Points on MAP for (var i = 0; i &lt; lat_lng.length; i++) { if ((i + 1) &lt; lat_lng.length) { var src = lat_lng[i]; var des = lat_lng[i + 1]; service.route({ origin: src, destination: des, travelMode: google.maps.DirectionsTravelMode.DRIVING }, function (result, status) { if (status == google.maps.DirectionsStatus.OK) { //Initialize the Path Array var path = new google.maps.MVCArray(); //Set the Path Stroke Color var poly = new google.maps.Polyline({ map: map, strokeColor: &#39;#4986E7&#39; }); poly.setPath(path); for (var i = 0, len = result.routes[0].overview_path.length; i &lt; len; i++) { path.push(result.routes[0].overview_path[i]); } } }); } } </pre> <p>Refer</p> <h1><a class="question-hyperlink" href="https://stackoverflow.com/questions/36024076/draw-different-route-line-between-multiple-markers-maps">draw different route line between multiple markers maps</a></h1>https://www.aspforums.net:443/Threads/884627/Google-Map-API-Draw-single-route-line-on-Map-from-start-location-to-end-location/https://www.aspforums.net:443/Threads/884627/Google-Map-API-Draw-single-route-line-on-Map-from-start-location-to-end-location/Tue, 20 Mar 2018 00:39:31 GMT