googlemaps-v3-utility-library
Version:
Google Maps API V3 Utility Library
92 lines (85 loc) • 3.62 kB
HTML
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Buffer</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
<script type="text/javascript" src="../src/arcgislink.js">
</script>
<script type="text/javascript">
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map, poly, svc;
var buffers = [];
function init() {
directionsDisplay = new google.maps.DirectionsRenderer();
var myOptions = {
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: new google.maps.LatLng(35.23,-80.84)
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
svc = new gmaps.ags.GeometryService('http://sampleserver3.arcgisonline.com/arcgis/rest/services/Geometry/GeometryServer');
gmaps.ags.Config.proxyUrl = '/proxy/proxy.ashx';
directionsDisplay.setMap(map);
calcRoute();
}
function calcRoute() {
var start = 'bank of america stadium, Charlotte, NC';
var end = 'time warner cable arena, Charlotte, NC';
var request = {
origin: start,
destination: end,
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
poly = new google.maps.Polyline({
path: response.routes[0].overview_path
});
poly.setMap(map);
try{
doBuffer();
}catch (e){
alert(e);
}
}
});
}
function doBuffer() {
for (var i = 0; i < buffers.length; i++) {
buffers[i].setMap(null);
}
buffers.length = 0;
var params = {
geometries: [poly],
bufferSpatialReference: gmaps.ags.SpatialReference.WEB_MERCATOR,
distances: [200],
unit: gmaps.ags.SRUnit.METER,
unionResults: true
};
svc.buffer(params, function(results, err) {
if (!err) {
var g;
for (var i = 0, I = results.geometries.length; i < I; i++) {
for (var j = 0, J = results.geometries[i].length; j < J; j++) {
g = results.geometries[i][j];
g.setMap(map);
buffers.push(g);
}
}
} else {
alert(err.message + err.details.join(','));
}
});
}
</script>
</head>
<body style="margin:0px; padding:0px;" >
<div id="map_canvas" style="width:100%; height:100%">
</div>
</body>
</html>