我有一个包含经度,纬度的MYSQL点数据库,正在读取数据库并为JavaScript Google API路线服务生成XML,以将这些点捕捉到最近的街道上。这是将起点和终点设置为自身的结果。
问题:
仅一个点被捕捉到了街道上,其余所有点均未显示,地图也放大到了该点。我感觉这是因为Directions Service是异步的,但是我不确定如何解决此问题,因此它将所有点从数据库中捕捉到最近的街道。
如果我不尝试使用Directions服务并将其捕捉到街道上,则db代码可正常工作并显示所有点
Javascript源代码:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>PHP GOOGLE MAPS POINTS</title>
<script src="http://maps.google.com/maps/api/js?sensor=false"
type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
function load() {
directionsDisplay = new google.maps.DirectionsRenderer();
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(40.06761, -79.9022),
zoom: 7,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
directionsDisplay.setMap(map);
// read in Long, lat from MYSQL DB from PHP file generated XML
downloadUrl("phpmap.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("name");
var address = markers[i].getAttribute("address");
var type = markers[i].getAttribute("type");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var request = {
origin:point,
destination:point,
travelMode: google.maps.TravelMode.DRIVING
};
directionsService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(result);
}
});
//
}
});
}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function doNothing() {}
//]]>
</script>
</head>
<body onload="load()">
<div style="width: 600px; height: 600px;" id="map"></div>
</body>
</html>
最佳答案
directionsRenderer会缩放地图以适合显示的方向,除非您将saveViewport选项设置为true。
为什么需要将数据库中的所有点都捕捉到最近的道路?这不是定向服务的目的。它是异步的,并受配额和速率限制的限制(请检查“状态”的值,应说明为什么只得到一个结果)。如果希望将数据库中每个条目的点捕捉到最近的道路,请离线捕获它们,并将它们也保存在数据库中。