GoogleマップAPIの利用例

先週から Google MAP API を使ったページを作成中です。
結局、平日は作業できなかったので、休みの日（祝日）にちょっと進めました。
JavaScript は、こんな感じです。オブジェクトの使い方にまだ改良の余地がありますが、とりあえず動きました。

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

function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer();
var latlng = new google.maps.LatLng( 38.241791,140.354632 );
var opts = {
zoom: 11,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}

map = new google.maps.Map(document.getElementById(“map_canvas”), opts);
directionsDisplay.setMap(map);
}

function calcRoute() {
var o_start = document.getElementById(“start_route”);
var start = o_start.options[o_start.selectedIndex].value;
var o_mid1 = document.getElementById(“mid1_route”);
var mid1 = o_mid1.options[o_mid1.selectedIndex].value;
var o_mid2 = document.getElementById(“mid2_route”);
var mid2 = o_mid2.options[o_mid2.selectedIndex].value;
var o_mid3 = document.getElementById(“mid3_route”);
var mid3 = o_mid3.options[o_mid3.selectedIndex].value;
var o_end = document.getElementById(“end_route”);
var end = o_end.options[o_end.selectedIndex].value;
var dist = 0;

var waypts = [];
if( mid1 != “-” ) {
waypts.push( { location: mid1, stopover: false } );
}
if( mid2 != “-” ) {
waypts.push( { location: mid2, stopover: false } );
}
if( mid3 != “-” ) {
waypts.push( { location: mid3, stopover: false } );
}

var request = {
origin: start,
destination:end,
waypoints: waypts,
optimizeWaypoints: true,
travelMode: google.maps.TravelMode.DRIVING
};

directionsService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(result);
var dist = 0;
var dlegs = result.routes[0].legs;
for(var i in dlegs ) {
dist = dist + dlegs[i].distance.value;
}
var dist_km = dist / 1000;
document.getElementById(“distance”).value = dist_km;
}
});

}

ＨＴＭＬ側をいっしょに載せないと意味ないですが、テキストから ＜ＳＥＬＥＣＴ＞文をＰＨＰで作って、JavaScript で Google MAP API を実装してみました。

下記参照URLを参照
Google MAP API の例その４

会社で、毎日、最上地区に配送で通っているドライバーの苦労が少しでも解れば、と思い、作ってみました。やっぱり、山形市から最上地区に行くとなると、遠いですね。ここに行ったら、こっちは今日は回れない、という話をよく聞くのですが、やっぱり無理でしょう。

他の地区についても、作ってみるのもおもしろいかな、と思ってます。