Question

我有一个包含经度，纬度的点的MYSQL数据库，我正在读取数据库并为javascript Google API路线服务生成XML以将点捕捉到最近的街道上。这是将原点和目的地设置为自身。

问题：

只有一个点被捕捉到街道上，其余点根本没有显示，地图也会缩放到该点。我有一种感觉，这是因为路线服务是异步的，但我不知道如何纠正这个问题所以它会将所有点从数据库中捕捉到最近的街道。

如果我不尝试使用路线服务并将它们捕捉到街道，则数据库代码将工作并显示所有点

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>

Answer 1

除非您将preserveViewport选项设置为true，否则directionsRenderer将缩放地图以适合显示的方向。
为什么您需要将数据库中的所有点都捕捉到最近的道路？这不是指导服务的目的。它是异步的，受限于配额和速率限制（检查“状态”的值，它应该解释为什么你只得到一个结果）。如果您希望数据库中每个条目的点都被捕捉到最近的道路，请将它们捕获并脱机并将它们保存在数据库中。

从点数据库捕捉到最近的街道路线服务

1 个答案: