Google 当纬度和经度点数很大时，地图无法正确绘制
Google map did not draw properly whenever number of lat & lang point is huge
我有array of lat and long。 length of array can be 200 to 2000 和 want to draw route through these points in google map。
我正在使用以下代码，但它没有给出正确的结果。
问题：
它有时会画一条 discontinue/irregular 线，只要没有经纬度记录很大。
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script type="text/javascript">
var MapPoints =[
{
"title": 'Agents current location',
"lat": '18.648661666666666',
"lng": '73.78641833333333',
"address": 'Agents current location',
"type": 'current'
},
{
"title": 'Checkin',
"lat": '18.639178333333334',
"lng": '73.79405',
"address": 'Checkin',
"type": 'checkin'
}
];
var routecoordinates = [[{"lat":"18.639178333333334","lng":"73.79405"},{"lat":"18.639215","lng":"73.794065"},{"lat":"18.639151666666667","lng":"73.79418333333334"},{"lat":"18.639136666666666","lng":"73.79418833333334"},{"lat":"18.639136666666666","lng":"73.79418833333334"},{"lat":"18.639136666666666","lng":"73.79418833333334"},{"lat":"18.639171666666666","lng":"73.79413"}],[{"lat":"18.639171666666666","lng":"73.79413"},{"lat":"18.639171666666666","lng":"73.79413"},{"lat":"18.639171666666666","lng":"73.79413"},{"lat":"18.6632","lng":"73.78678666666666"},{"lat":"18.663186666666665","lng":"73.78671333333334"},{"lat":"18.663133333333334","lng":"73.78676833333334"},{"lat":"18.663081666666667","lng":"73.78682333333333"},{"lat":"18.66307","lng":"73.78683333333333"}],[{"lat":"18.66307","lng":"73.78683333333333"},{"lat":"18.662995000000002","lng":"73.78700333333333"},{"lat":"18.662995000000002","lng":"73.78702"},{"lat":"18.662998333333334","lng":"73.78703666666667"},{"lat":"18.662946666666667","lng":"73.78711833333334"},{"lat":"18.662903333333336","lng":"73.78721333333333"},{"lat":"18.662838333333333","lng":"73.78732166666667"},{"lat":"18.662746666666667","lng":"73.78733666666668"}],[{"lat":"18.662746666666667","lng":"73.78733666666668"},{"lat":"18.662836666666667","lng":"73.7872"},{"lat":"18.662883333333333","lng":"73.78726499999999"},{"lat":"18.662958333333332","lng":"73.78737333333333"},{"lat":"18.662985","lng":"73.78744499999999"},{"lat":"18.662881666666667","lng":"73.78753499999999"},{"lat":"18.66291","lng":"73.78758666666666"},{"lat":"18.663085000000002","lng":"73.787595"}],[{"lat":"18.663085000000002","lng":"73.787595"},{"lat":"18.66283","lng":"73.78750833333334"},{"lat":"18.662786666666666","lng":"73.78742666666668"},{"lat":"18.662786666666666","lng":"73.78742666666668"},{"lat":"18.6628","lng":"73.78753666666667"},{"lat":"18.662793333333333","lng":"73.78753666666667"},{"lat":"18.662786666666666","lng":"73.78741833333333"},{"lat":"18.662778333333332","lng":"73.78736666666667"}],[{"lat":"18.662778333333332","lng":"73.78736666666667"},{"lat":"18.66287","lng":"73.78718"},{"lat":"18.66292","lng":"73.7871"},{"lat":"18.66293","lng":"73.78700666666667"},{"lat":"18.662965","lng":"73.78692666666667"},{"lat":"18.66301","lng":"73.78685666666667"},{"lat":"18.66305","lng":"73.786765"},{"lat":"18.663063333333334","lng":"73.78671666666668"}],[{"lat":"18.663063333333334","lng":"73.78671666666668"},{"lat":"18.66276","lng":"73.78662333333334"},{"lat":"18.663498333333333","lng":"73.78647166666666"},{"lat":"18.66257166666667","lng":"73.78524999999999"},{"lat":"18.66238333333333","lng":"73.784495"},{"lat":"18.661785000000002","lng":"73.78371999999999"},{"lat":"18.661973333333332","lng":"73.78262500000001"},{"lat":"18.664985","lng":"73.78464833333334"}],[{"lat":"18.664985","lng":"73.78464833333334"},{"lat":"18.659266666666667","lng":"73.77801833333334"},{"lat":"18.658726666666666","lng":"73.77779000000001"},{"lat":"18.657511666666668","lng":"73.77928"},{"lat":"18.657111666666665","lng":"73.77970666666667"},{"lat":"18.657291666666666","lng":"73.77968833333333"},{"lat":"18.657286666666668","lng":"73.77968000000001"},{"lat":"18.65722","lng":"73.77964666666666"}],[{"lat":"18.65722","lng":"73.77964666666666"},{"lat":"18.65722","lng":"73.77964666666666"},{"lat":"18.657136666666666","lng":"73.77970499999999"},{"lat":"18.657136666666666","lng":"73.77970499999999"},{"lat":"18.657136666666666","lng":"73.77970499999999"},{"lat":"18.657136666666666","lng":"73.77970499999999"},{"lat":"18.65705","lng":"73.77973333333333"},{"lat":"18.657045","lng":"73.77973666666666"}],[{"lat":"18.657045","lng":"73.77973666666666"},{"lat":"18.657045","lng":"73.77973666666666"},{"lat":"18.657045","lng":"73.77973666666666"},{"lat":"18.657018333333333","lng":"73.77974666666667"},{"lat":"18.657018333333333","lng":"73.77974833333333"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"}],[{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"}],[{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.65707666666667","lng":"73.779675"},{"lat":"18.65707666666667","lng":"73.779675"},{"lat":"18.65707666666667","lng":"73.779675"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"}],[{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.646343333333334","lng":"73.78805833333332"},{"lat":"18.646421666666665","lng":"73.78802333333333"}],[{"lat":"18.646421666666665","lng":"73.78802333333333"},{"lat":"18.64644333333333","lng":"73.78812500000001"},{"lat":"18.64644333333333","lng":"73.78812500000001"},{"lat":"18.646335","lng":"73.78815333333334"},{"lat":"18.646441666666664","lng":"73.78812500000001"},{"lat":"18.64644333333333","lng":"73.78812500000001"},{"lat":"18.64644333333333","lng":"73.78812666666666"},{"lat":"18.649493333333332","lng":"73.78677333333333"}],[{"lat":"18.649493333333332","lng":"73.78677333333333"},{"lat":"18.648661666666666","lng":"73.78641833333333"}]];
var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer({
suppressMarkers: true
});
map = new google.maps.Map(document.getElementById('dvMap'), {
mapTypeId: google.maps.MapTypeId.ROADMAP,
scrollwheel: false
});
directionsDisplay.setMap(map);
var infowindow = new google.maps.InfoWindow();
var bounds = new google.maps.LatLngBounds();
for (i = 0; i < MapPoints.length; i++) {
var data = MapPoints[i]
var myLatlng = new google.maps.LatLng(data.lat, data.lng);
var icon = "";
switch (data.type) {
case "checkin":
icon = "blue";
break;
case "pending":
icon = "red";
break;
case "intransit":
icon = "yellow";
break;
case "complete":
icon = "green";
break;
case "cancel":
icon = "purple";
break;
case "current":
icon = "current";
break;
}
if(icon=="current"){
icon = "http://example.com/images/ins.png";
}
else
{
icon = "http://maps.google.com/mapfiles/ms/icons/" + icon + ".png";
}
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: data.title,
animation: google.maps.Animation.DROP,
icon: new google.maps.MarkerImage(icon)
});
//flightPlanCoordinates.push(marker.getPosition());
bounds.extend(marker.position);
(function (marker, data) {
google.maps.event.addListener(marker, "click", function (e) {
infowindow.setContent(data.address);
infowindow.open(map, marker);
});
})(marker, data);
}
map.fitBounds(bounds);
var k = 0;
var interval = setInterval(function () {
var flightPlanCoordinates = [];
var coordinates = routecoordinates[k];
for (j = 0; j < coordinates.length; j++) {
var data = coordinates[j]
var myLatlng = new google.maps.LatLng(data.lat, data.lng);
flightPlanCoordinates.push(myLatlng);
}
var start = flightPlanCoordinates[0];
var end = flightPlanCoordinates[flightPlanCoordinates.length - 1];
var waypts = [];
for (var j = 1; j < flightPlanCoordinates.length - 1; j++) {
waypts.push({
location: flightPlanCoordinates[j],
stopover: true,
});
}
var request = {
origin: start,
destination: end,
waypoints: waypts,
optimizeWaypoints: true,
travelMode: google.maps.TravelMode.DRIVING,
};
directionsService.route(request, function(response, status) {
//alert(k);
//document.getElementById('status').innerHTML +="request status:"+status+k+"<br>";
if (status == google.maps.DirectionsStatus.OK) {
var polylineOptionsActual = {
strokeColor : '#FF0000',
strokeOpacity: 1.0,
strokeWeight : 5};
var directionsRenderer = new google.maps.DirectionsRenderer;
directionsRenderer.setMap(map);
directionsRenderer.setOptions( { polylineOptions: polylineOptionsActual, suppressMarkers: true} );
directionsRenderer.setDirections(response);
}
else{}
});
k++;
if (k == routecoordinates.length) {
clearInterval(interval);
}
}, 600);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id="opacity-bg" class="opacity-bg">Loading...</div>
几年前，当我使用 die google-maps API 时，我发现了这个聪明的函数 google 用于防止 DOS 攻击。
如果您询问的地点超过五个，回答时间就会变慢，从而降低机器人的积极性。
我通过循环请求构建解决方法，中间等待几毫秒。
这可能是您的问题吗？尝试使用长度为 5、6 或 10 的数组。
我有array of lat and long。 length of array can be 200 to 2000 和 want to draw route through these points in google map。
我正在使用以下代码，但它没有给出正确的结果。
问题：
它有时会画一条 discontinue/irregular 线，只要没有经纬度记录很大。
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script type="text/javascript">
var MapPoints =[
{
"title": 'Agents current location',
"lat": '18.648661666666666',
"lng": '73.78641833333333',
"address": 'Agents current location',
"type": 'current'
},
{
"title": 'Checkin',
"lat": '18.639178333333334',
"lng": '73.79405',
"address": 'Checkin',
"type": 'checkin'
}
];
var routecoordinates = [[{"lat":"18.639178333333334","lng":"73.79405"},{"lat":"18.639215","lng":"73.794065"},{"lat":"18.639151666666667","lng":"73.79418333333334"},{"lat":"18.639136666666666","lng":"73.79418833333334"},{"lat":"18.639136666666666","lng":"73.79418833333334"},{"lat":"18.639136666666666","lng":"73.79418833333334"},{"lat":"18.639171666666666","lng":"73.79413"}],[{"lat":"18.639171666666666","lng":"73.79413"},{"lat":"18.639171666666666","lng":"73.79413"},{"lat":"18.639171666666666","lng":"73.79413"},{"lat":"18.6632","lng":"73.78678666666666"},{"lat":"18.663186666666665","lng":"73.78671333333334"},{"lat":"18.663133333333334","lng":"73.78676833333334"},{"lat":"18.663081666666667","lng":"73.78682333333333"},{"lat":"18.66307","lng":"73.78683333333333"}],[{"lat":"18.66307","lng":"73.78683333333333"},{"lat":"18.662995000000002","lng":"73.78700333333333"},{"lat":"18.662995000000002","lng":"73.78702"},{"lat":"18.662998333333334","lng":"73.78703666666667"},{"lat":"18.662946666666667","lng":"73.78711833333334"},{"lat":"18.662903333333336","lng":"73.78721333333333"},{"lat":"18.662838333333333","lng":"73.78732166666667"},{"lat":"18.662746666666667","lng":"73.78733666666668"}],[{"lat":"18.662746666666667","lng":"73.78733666666668"},{"lat":"18.662836666666667","lng":"73.7872"},{"lat":"18.662883333333333","lng":"73.78726499999999"},{"lat":"18.662958333333332","lng":"73.78737333333333"},{"lat":"18.662985","lng":"73.78744499999999"},{"lat":"18.662881666666667","lng":"73.78753499999999"},{"lat":"18.66291","lng":"73.78758666666666"},{"lat":"18.663085000000002","lng":"73.787595"}],[{"lat":"18.663085000000002","lng":"73.787595"},{"lat":"18.66283","lng":"73.78750833333334"},{"lat":"18.662786666666666","lng":"73.78742666666668"},{"lat":"18.662786666666666","lng":"73.78742666666668"},{"lat":"18.6628","lng":"73.78753666666667"},{"lat":"18.662793333333333","lng":"73.78753666666667"},{"lat":"18.662786666666666","lng":"73.78741833333333"},{"lat":"18.662778333333332","lng":"73.78736666666667"}],[{"lat":"18.662778333333332","lng":"73.78736666666667"},{"lat":"18.66287","lng":"73.78718"},{"lat":"18.66292","lng":"73.7871"},{"lat":"18.66293","lng":"73.78700666666667"},{"lat":"18.662965","lng":"73.78692666666667"},{"lat":"18.66301","lng":"73.78685666666667"},{"lat":"18.66305","lng":"73.786765"},{"lat":"18.663063333333334","lng":"73.78671666666668"}],[{"lat":"18.663063333333334","lng":"73.78671666666668"},{"lat":"18.66276","lng":"73.78662333333334"},{"lat":"18.663498333333333","lng":"73.78647166666666"},{"lat":"18.66257166666667","lng":"73.78524999999999"},{"lat":"18.66238333333333","lng":"73.784495"},{"lat":"18.661785000000002","lng":"73.78371999999999"},{"lat":"18.661973333333332","lng":"73.78262500000001"},{"lat":"18.664985","lng":"73.78464833333334"}],[{"lat":"18.664985","lng":"73.78464833333334"},{"lat":"18.659266666666667","lng":"73.77801833333334"},{"lat":"18.658726666666666","lng":"73.77779000000001"},{"lat":"18.657511666666668","lng":"73.77928"},{"lat":"18.657111666666665","lng":"73.77970666666667"},{"lat":"18.657291666666666","lng":"73.77968833333333"},{"lat":"18.657286666666668","lng":"73.77968000000001"},{"lat":"18.65722","lng":"73.77964666666666"}],[{"lat":"18.65722","lng":"73.77964666666666"},{"lat":"18.65722","lng":"73.77964666666666"},{"lat":"18.657136666666666","lng":"73.77970499999999"},{"lat":"18.657136666666666","lng":"73.77970499999999"},{"lat":"18.657136666666666","lng":"73.77970499999999"},{"lat":"18.657136666666666","lng":"73.77970499999999"},{"lat":"18.65705","lng":"73.77973333333333"},{"lat":"18.657045","lng":"73.77973666666666"}],[{"lat":"18.657045","lng":"73.77973666666666"},{"lat":"18.657045","lng":"73.77973666666666"},{"lat":"18.657045","lng":"73.77973666666666"},{"lat":"18.657018333333333","lng":"73.77974666666667"},{"lat":"18.657018333333333","lng":"73.77974833333333"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"}],[{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.657011666666666","lng":"73.77974666666667"}],[{"lat":"18.657011666666666","lng":"73.77974666666667"},{"lat":"18.65707666666667","lng":"73.779675"},{"lat":"18.65707666666667","lng":"73.779675"},{"lat":"18.65707666666667","lng":"73.779675"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"}],[{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.657055","lng":"73.77967666666667"},{"lat":"18.646343333333334","lng":"73.78805833333332"},{"lat":"18.646421666666665","lng":"73.78802333333333"}],[{"lat":"18.646421666666665","lng":"73.78802333333333"},{"lat":"18.64644333333333","lng":"73.78812500000001"},{"lat":"18.64644333333333","lng":"73.78812500000001"},{"lat":"18.646335","lng":"73.78815333333334"},{"lat":"18.646441666666664","lng":"73.78812500000001"},{"lat":"18.64644333333333","lng":"73.78812500000001"},{"lat":"18.64644333333333","lng":"73.78812666666666"},{"lat":"18.649493333333332","lng":"73.78677333333333"}],[{"lat":"18.649493333333332","lng":"73.78677333333333"},{"lat":"18.648661666666666","lng":"73.78641833333333"}]];
var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer({
suppressMarkers: true
});
map = new google.maps.Map(document.getElementById('dvMap'), {
mapTypeId: google.maps.MapTypeId.ROADMAP,
scrollwheel: false
});
directionsDisplay.setMap(map);
var infowindow = new google.maps.InfoWindow();
var bounds = new google.maps.LatLngBounds();
for (i = 0; i < MapPoints.length; i++) {
var data = MapPoints[i]
var myLatlng = new google.maps.LatLng(data.lat, data.lng);
var icon = "";
switch (data.type) {
case "checkin":
icon = "blue";
break;
case "pending":
icon = "red";
break;
case "intransit":
icon = "yellow";
break;
case "complete":
icon = "green";
break;
case "cancel":
icon = "purple";
break;
case "current":
icon = "current";
break;
}
if(icon=="current"){
icon = "http://example.com/images/ins.png";
}
else
{
icon = "http://maps.google.com/mapfiles/ms/icons/" + icon + ".png";
}
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: data.title,
animation: google.maps.Animation.DROP,
icon: new google.maps.MarkerImage(icon)
});
//flightPlanCoordinates.push(marker.getPosition());
bounds.extend(marker.position);
(function (marker, data) {
google.maps.event.addListener(marker, "click", function (e) {
infowindow.setContent(data.address);
infowindow.open(map, marker);
});
})(marker, data);
}
map.fitBounds(bounds);
var k = 0;
var interval = setInterval(function () {
var flightPlanCoordinates = [];
var coordinates = routecoordinates[k];
for (j = 0; j < coordinates.length; j++) {
var data = coordinates[j]
var myLatlng = new google.maps.LatLng(data.lat, data.lng);
flightPlanCoordinates.push(myLatlng);
}
var start = flightPlanCoordinates[0];
var end = flightPlanCoordinates[flightPlanCoordinates.length - 1];
var waypts = [];
for (var j = 1; j < flightPlanCoordinates.length - 1; j++) {
waypts.push({
location: flightPlanCoordinates[j],
stopover: true,
});
}
var request = {
origin: start,
destination: end,
waypoints: waypts,
optimizeWaypoints: true,
travelMode: google.maps.TravelMode.DRIVING,
};
directionsService.route(request, function(response, status) {
//alert(k);
//document.getElementById('status').innerHTML +="request status:"+status+k+"<br>";
if (status == google.maps.DirectionsStatus.OK) {
var polylineOptionsActual = {
strokeColor : '#FF0000',
strokeOpacity: 1.0,
strokeWeight : 5};
var directionsRenderer = new google.maps.DirectionsRenderer;
directionsRenderer.setMap(map);
directionsRenderer.setOptions( { polylineOptions: polylineOptionsActual, suppressMarkers: true} );
directionsRenderer.setDirections(response);
}
else{}
});
k++;
if (k == routecoordinates.length) {
clearInterval(interval);
}
}, 600);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id="opacity-bg" class="opacity-bg">Loading...</div>
几年前，当我使用 die google-maps API 时，我发现了这个聪明的函数 google 用于防止 DOS 攻击。 如果您询问的地点超过五个，回答时间就会变慢，从而降低机器人的积极性。 我通过循环请求构建解决方法，中间等待几毫秒。
这可能是您的问题吗？尝试使用长度为 5、6 或 10 的数组。