//
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
var side_bar_html = "";
var gmarkers = [];
function load() {
directionsDisplay = new google.maps.DirectionsRenderer();
//directionsDisplay.setMap(map);
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(11.342339,77.727497),
zoom: 12,
mapTypeId: 'roadmap'
});
directionsDisplay.setMap(map);
var infoWindow = new google.maps.InfoWindow;
var sidebar = document.getElementById('sidebar');
var point = [];
var point1 = [];
var path2 = [];
downloadUrl("support.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("point");
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("s_name");
var img5 = markers[i].getAttribute("image_type");
var type = markers[i].getAttribute("type");
point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var html = "<b>" + type + "</b>";
var image_in = "<img src='http://sundar.lan/tele3/images/"+ img5 + "'/>";
var icon = type;
var marker = new google.maps.Marker({
map: map,
position: point,
draggable: true,
icon: icon.icon
});
var name = '<h3>' + "Students :" +'</h3>'+'<h4>' + name +'</h4>';
//var img = '<h3>' +'<b>' + img5 + '</b>'+'</h3>';
bindInfoWindow(marker, map, infoWindow, name,image_in);
// var sidebarEntry = createSidebarEntry(marker, type);
sidebar.appendChild(createSidebarEntry(marker,type));
}
for (var j = 0; j < markers.length; j++) {
point1[j] = new google.maps.LatLng(
parseFloat(markers[j].getAttribute("lat")),
parseFloat(markers[j].getAttribute("lng")));
var flight = new google.maps.Polyline({
path: point1,
strokeColor: '#FF0000',
strokeOpacity: 1.0,
strokeWeight:2
});
flight.setMap(map);
console.log(point1);
calcRoute(point1)
}
});
function createSidebarEntry(marker,type) {
var div = document.createElement('div');
var html = '<h2>' +'<b>' + type + '</b>'+'</h2>';
div.innerHTML = html;
div.style.cursor = 'pointer';
div.style.marginBottom = '5px';
google.maps.event.addDomListener(div, 'click', function() {
google.maps.event.trigger(marker, 'click');
});
google.maps.event.addDomListener(div, 'mouseover', function() {
div.style.backgroundColor = '#eee';
});
google.maps.event.addDomListener(div, 'mouseout', function() {
div.style.backgroundColor = '#fff';
});
return div;
}
}
function calcRoute(path2) {
//alert(path);
//var start = document.getElementById('start').value;
//var end = document.getElementById('end').value;
for(var k=0; k<path2.length-1; k++)
{
//alert(k);
var request = {
origin:path2[k],
destination:path2[k+1],
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
//selected_path = selected_path.concat(results.routes[0].overview_path);
}
/*else {
// alert an error message when the route could nog be calculated.
if (status == 'ZERO_RESULTS') {
alert('No route could be found between the origin and destination.');
} else if (status == 'UNKNOWN_ERROR') {
alert('A directions request could not be processed due to a server error. The request may succeed if you try again.');
} else if (status == 'REQUEST_DENIED') {
alert('This webpage is not allowed to use the directions service.');
} else if (status == 'OVER_QUERY_LIMIT') {
alert('The webpage has gone over the requests limit in too short a period of time.');
} else if (status == 'NOT_FOUND') {
alert('At least one of the origin, destination, or waypoints could not be geocoded.');
} else if (status == 'INVALID_REQUEST') {
alert('The DirectionsRequest provided was invalid.');
} else {
alert("There was an unknown error in your request. Requeststatus: nn"+status);
}
}*/
});
}
}
function bindInfoWindow(marker,map, infoWindow, name,image_in) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(name + image_in);
infoWindow.open(map, marker);
});
}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function doNothing() {}
//]]>
Students stop list's