今更な感じですが、使う機会があったのでメモ書き。
Google Maps JavaScript APIのV3を使ってルート検索を行うまで。
ルート検索は google.maps.DirectionsService を使って行います。V2の場合は GDirections だったのかな。
<html> <head> <meta http-equiv="Content-type" content="text/html; charset=UTF-8"/> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> var map; var directionsDisplay; var directionsService = new google.maps.DirectionsService(); function initialize() { // マップの初期化 var mapOptions = { zoom: 8, center: new google.maps.LatLng(36, 140), mapTypeControl: true, zoomControl: true, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById('id_map'), mapOptions); // ルート検索結果表示の初期化 directionsDisplay = new google.maps.DirectionsRenderer({ polylineOptions: { strokeColor: '#FF0000', strokeWeight: 2, strokeOpacity: 0.7 } }); directionsDisplay.setMap(map); } function search() { // 検索 var keyword_begin = document.getElementById('id_begin').value; var keyword_end = document.getElementById('id_end').value; var request = { origin: keyword_begin, destination: keyword_end, avoidHighways: true, // 高速道路を除外 avoidTolls: true, // 有料道路を除外 travelMode: google.maps.DirectionsTravelMode.DRIVING // 移動手段は車 }; directionsService.route(request, function(result, status) { if (status, google.maps.DirectionsStatus.OK) { // ヒットした結果を表示 directionsDisplay.setDirections(result); } }); return false; } </script> </head> <body onload="initialize();"> <h1>Google Maps API ルート検索デモ</h1> <form onsubmit="return search();"> <div> 始点: <input type="text" name="start" id="id_begin"/> </div> <div> 終点: <input type="text" name="start" id="id_end"/> </div> <div> <input type="submit" value="検索"/> </div> </form> <div style="width: 800px; height: 600px;" id="id_map"></div> </body> </html>