loadFromWaypoints with more than 25 points using Google Maps API v2
gdirections, google-maps, javascript
Solution
PathPolyline does the job: https://github.com/spinningcode/PathPolyline
From its description:
PathPolyline is a simple library that can be used to get around the 25 points limitation on the maximum number of waypoints with GDirection.loadFromWaypoints method (Google Map API V2).
The readme file has some usage instructions and demonstration code which you may find helpful.
Problem
I have a problem. I know that in google maps, the `GDirections.loadFromWayPoints` has limit of 25 `GLatLng` objects. What I want is to make a route of, say, 300 points. How can I do that? The solution I thought of was using arrays of 25 positions, and then call loadFromWaypoints, create another array of 25 positions, and call loadFromWayPoints and so on, but when I do this, I can just see the first array in my map. Any suggestions? Here is my ajax function which attempts to do what I've described: ``` function ajaxFunction(url){ var ajaxRequest; // The variable that makes Ajax possible! try{ // Opera 8.0+, Firefox, Safari ajaxRequest = new XMLHttpRequest(); } catch (e){ // Internet Explorer Browsers try{ ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try{ ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e){ // Something went wrong alert("Your browser broke!"); return false; } } } // Create a function that will receive data sent from the server ajaxRequest.onreadystatechange = function(){ var dirMap = new GMap2(document.getElementById("map")); if(ajaxRequest.readyState == 4){ var cnt = 0; var cen = 0; var rta = ajaxRequest.responseText.split("^"); for (var i = 0; i<(rta.length) -1; i++) { var reg = rta[i].split("$"); var lat = reg[0]; var lng = reg[1]; if (cnt == 24) { var marker = new GMarker(arrayWP[1]); dirMap.addOverlay(marker); if (cen == 0) { dirMap.setCenter(arrayWP[0], 12); cen = 1; } dirMap.setUIToDefault(); directions = new GDirections(dirMap); directions.loadFromWaypoints(arrayWP); arrayWP[0] = new GLatLng(lat,lng); cnt = 1; } else { arrayWP[cnt] = new GLatLng(lat,lng); cnt++; } } /* if (cen == 0) { var marker = new GMarker(arrayWP[1]); dirMap.addOverlay(marker); if (cen == 0) { dirMap.setCenter(arrayWP[0], 12); cen = 1; } dirMap.setUIToDefault(); directions = new GDirections(dirMap); directions.loadFromWaypoints(arrayWP); }*/ } } ajaxRequest.open("GET", url, true); ajaxRequest.send(null); } ```