2013-05-22 45 views
3

我想捕捉到最近的道路的坐标。但我仍然无法以简单的方式做到这一点。 这是简单的代码,如何提高它那结果将是在道路上的标记:
谷歌地图API - 捕捉标记到最近的道路

<!DOCTYPE html> 
<html> 
<head> 
<title>Map</title> 

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<style type="text/css"> 
html { height: 100% } 
body { height: 100%; margin: 0; padding: 0 } 
#map_canvas { height: 300px; width:600px } 
</style> 

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 

<script type="text/javascript"> 
    function initialize() { 
     var homeLatlng = new google.maps.LatLng(24.696554,-81.328238); 

     var myOptions = { 
      zoom: 15, 
      center: homeLatlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

     var image = new google.maps.MarkerImage(
      'http://maps.google.com/mapfiles/ms/micons/green-dot.png', 
      new google.maps.Size(32, 32), // size 
      new google.maps.Point(0,0), // origin 
      new google.maps.Point(16, 32) // anchor 
     ); 

     var shadow = new google.maps.MarkerImage(
      'http://maps.google.com/mapfiles/ms/micons/msmarker.shadow.png', 
      new google.maps.Size(59, 32), // size 
      new google.maps.Point(0,0), // origin 
      new google.maps.Point(16, 32) // anchor 
     ); 

     var homeMarker = new google.maps.Marker({ 
      position: homeLatlng, 
      map: map, 
      title: "Check this cool location", 
      icon: image, 
      shadow: shadow 
     }); 
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
</head> 
<body> 
    <div id="map_canvas"></div> 
</body> 
</html> 

我想获得的最简单的方法思路。 感谢您的帮助。

回答

4

使用路线服务。从兴趣点到兴趣点获取行车路线。应该在路上。

var directionsService = new google.maps.DirectionsService(); 

directionsService.route({origin:homeLatlng, destination:homeLatlng, travelMode: google.maps.DirectionsTravelMode.DRIVING}, function(response, status) { 
    if (status == google.maps.DirectionsStatus.OK) 
    { 
    var homeMarker = new google.maps.Marker({ 
     position: response.routes[0].legs[0].start_location, 
     map: map, 
     title: "Check this cool location", 
     icon: image, 
     shadow: shadow 
    }); 
    } else { 
    var homeMarker = new google.maps.Marker({ 
     position: homeLatlng, 
     map: map, 
     title: "Check this cool location", 
     icon: image, 
     shadow: shadow 
    }); 
    } 
}); 

example

+0

这将是与代码示例有用的解释。 – wahas

+0

我想我仍然在做错事。没有显示.. – wahas

+0

与实例相比。 – geocodezip