在2个点之间的每个交叉点上放置标记并获取它们的坐标

我试图获得2点之间的驾驶路线中涉及的路口数目，但我得到0的答案已经得到答案。在2个点之间的每个交叉点上放置标记并获取它们的坐标

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="FYP.WebForm1" %> 

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <title>Directions service</title> 
    <style> 
     #panel { 
     position: absolute; 
     top: 5px; 
     left: 50%; 
     margin-left: -180px; 
     z-index: 5; 
     background-color: #fff; 
     padding: 5px; 
     border: 1px solid #999; 
     } 
    </style> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script> 
    <script> 

     var directionsService; 
     var markerArray = []; 

     function initialize() { 
      // Instantiate a directions service.   
      directionsService = new google.maps.DirectionsService(); 
     } 

     function calcRoute() { 

      // First, remove any existing markers from the map. 
      for (var i = 0; i < markerArray.length; i++) { 
       markerArray[i].setMap(null); 
      } 

      // Now, clear the array itself. 
      markerArray = []; 

      // Retrieve the start and end locations and create 
      // a DirectionsRequest using DRIVING directions. 

      var request = { 
       origin: "33.688782,72.980038", 
       destination: "33.689023,72.982422", 
       travelMode: google.maps.TravelMode.DRIVING 
      }; 

      // Route the directions and use the response 
      directionsService.route(request, function (response, status) { 

       if (status == google.maps.DirectionsStatus.OK) { 

        var warnings = document.getElementById('warnings_panel'); 
        warnings.innerHTML = '<b>' + response.routes[0].warnings + '</b>'; 

        // directionsDisplay.setDirections(response); 

        var myRoute = response.routes[0].legs[0];  

        for (var i = 0; i < myRoute.steps.length; i++) { 
         var marker = new google.maps.Marker({ 
          position: myRoute.steps[i].start_location, 
          map: map 
         }); 

         markerArray[i] = marker; 
        } 
       } 
      });  
      alert("Length= " + markerArray.length); 
     } 

    </script> 
    </head> 
    <body onload="initialize();"> 
    <div id="panel"> 

    <button id="button1" onclick="calcRoute();" runat="server">Get Markers Count</button> 
    </div> 
    &nbsp; 
    <div id="warnings_panel" style="width:100%;height:10%;text-align:center"></div> 
    </body> 
</html>

我在两天前开始使用谷歌地图API和JavaScript，因此我不擅长它。您的帮助将受到高度赞赏。

来源

2014-12-03 Haseeb Jadoon

directionsService是异步的。结果返回前，您正在调用alert。除了至少一个javascript错误（地图未在您的代码中定义）。

工作代码片段：

var directionsService; 
 
var markerArray = []; 
 

 
function initialize() { 
 
    // Instantiate a directions service.   
 
    directionsService = new google.maps.DirectionsService(); 
 
} 
 
google.maps.event.addDomListener(window, 'load', initialize); 
 

 

 
function calcRoute() { 
 

 
    // First, remove any existing markers from the map. 
 
    for (var i = 0; i < markerArray.length; i++) { 
 
    markerArray[i].setMap(null); 
 
    } 
 

 
    // Now, clear the array itself. 
 
    markerArray = []; 
 

 
    // Retrieve the start and end locations and create 
 
    // a DirectionsRequest using DRIVING directions. 
 

 
    var request = { 
 
    origin: "33.688782,72.980038", 
 
    destination: "33.689023,72.982422", 
 
    travelMode: google.maps.TravelMode.DRIVING 
 
    }; 
 

 
    // Route the directions and use the response 
 
    directionsService.route(request, function(response, status) { 
 

 
    if (status == google.maps.DirectionsStatus.OK) { 
 

 
     var warnings = document.getElementById('warnings_panel'); 
 
     warnings.innerHTML = '<b>' + response.routes[0].warnings + '</b>'; 
 

 
     // directionsDisplay.setDirections(response); 
 

 
     var myRoute = response.routes[0].legs[0]; 
 

 
     for (var i = 0; i < myRoute.steps.length; i++) { 
 
     var marker = new google.maps.Marker({ 
 
      position: myRoute.steps[i].start_location, 
 
      // map: map 
 
     }); 
 

 
     markerArray[i] = marker; 
 
     } 
 
    } 
 
    alert("Length= " + markerArray.length); 
 
    }); 
 
}

#panel { 
 
    position: absolute; 
 
    top: 5px; 
 
    left: 50%; 
 
    margin-left: -180px; 
 
    z-index: 5; 
 
    background-color: #fff; 
 
    padding: 5px; 
 
    border: 1px solid #999; 
 
}

<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry"></script> 
 
<div id="panel"> 
 

 
    <button id="button1" onclick="calcRoute();" runat="server">Get Markers Count</button> 
 
</div> 
 
&nbsp; 
 
<div id="warnings_panel" style="width:100%;height:10%;text-align:center"></div>

来源

2014-12-03 10:24:47 geocodezip

在2个点之间的每个交叉点上放置标记并获取它们的坐标

回答

相关问题