Created
April 20, 2011 12:33
-
-
Save silphire/931209 to your computer and use it in GitHub Desktop.
マウスクリックで指定した2点間をの経路を算出する
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html lang="ja"> <head> | |
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"> | |
<title>test</title> | |
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> | |
<script type="text/javascript" src="map.js"></script> | |
</head> | |
<body onload="initialize()"> | |
<div id="control" style="width: 100%; height: 10%"> | |
<input type="button" value="clear" onclick="clear_markers()"> | |
</div> | |
<div id="main_map" style="width: 100%; height: 80%"> | |
</div> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var theMap; | |
var directionsService = new google.maps.DirectionsService(); | |
var directionsDisplay; | |
var markers = []; | |
var wayPoints = []; | |
function initialize() { | |
var myOptions = { | |
zoom: 8, | |
center: new google.maps.LatLng(35.65, 139.75), | |
mapTypeId: google.maps.MapTypeId.ROADMAP | |
}; | |
directionsDisplay = new google.maps.DirectionsRenderer(); | |
theMap = new google.maps.Map(document.getElementById("main_map"), myOptions); | |
directionsDisplay.setMap(theMap); | |
google.maps.event.addListener(theMap, 'click', function(ev) { | |
// マーカー表示 | |
var newMarker = new google.maps.Marker({ | |
position: ev.latLng, | |
draggable: false, | |
map: theMap | |
}); | |
markers.push(newMarker); | |
if(markers.length > 2) { | |
wayPoints.push(ev.latLng); | |
} | |
if(markers.length >= 2) { | |
var request = { | |
origin: markers[0].position, | |
destination: markers[markers.length - 1].position, | |
waypoints: wayPoints, | |
travelMode: google.maps.DirectionsTravelMode.WALKING, | |
unitSystem: google.maps.DirectionsUnitSystem.METRIC | |
}; | |
directionsService.route(request, function(result, status) { | |
if(status == google.maps.DirectionsStatus.OK) { | |
directionsDisplay.setDirections(result); | |
} | |
}); | |
} | |
}); | |
} | |
function clear_markers() { | |
} | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment