-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathfinal_route.php
109 lines (98 loc) · 3.56 KB
/
final_route.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
<?php include('connect.php');?>
<?php
//$email=mysqli_real_escape_string($conn,$_POST["email"]);
$sql = "SELECT * FROM donors where email='[email protected]'";
$result = mysqli_query($conn, $sql);
if ($result->num_rows > 0) {
//echo "<br><table><tr><th>First name</th><th>Room No.</th><th>Name</th><th>Gender</th><th>Phone No.</th><th>Age</th><th>Address</th></tr>";
// output data of each row
while($row = $result->fetch_assoc()) {
$don=$row['address'];
}
}
$sql = "SELECT * FROM volunteers where email='[email protected]'";
$result = mysqli_query($conn, $sql);
if ($result->num_rows > 0) {
//echo "<br><table><tr><th>First name</th><th>Room No.</th><th>Name</th><th>Gender</th><th>Phone No.</th><th>Age</th><th>Address</th></tr>";
// output data of each row
while($row = $result->fetch_assoc()) {
$vol=$row['address'];
}
}
?>
<!DOCTYPE html>
<html>
<!--refer https://developers.google.com/maps/documentation/javascript/directions -->
<head>
<title>Directions service</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<style>
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div>
<button id="directions">Trace Donor</button>
<div>
<strong>Results</strong>
</div>
<div id="output"></div>
</div>
<div id="map"></div>
<script>
var map;
$("#directions").click(function () {
var originLoc = "andheri";
var destinationLoc = "dadar";
var selectedMode = document.getElementById('mode').value;
var geocoder = new google.maps.Geocoder;
var directionsDisplay = new google.maps.DirectionsRenderer;
var directionsService = new google.maps.DirectionsService;
directionsDisplay.setMap(map);
//getting directions from Google
directionsService.route ({
origin: originLoc,
destination: destinationLoc,
travelMode: google.maps.TravelMode[selectedMode],
avoidHighways: false,
avoidTolls: false
}, function (response, status) {
if (status !== 'OK') {
alert('Error was: ' + status);
} else {
directionsDisplay.setDirections(response);
var outputDiv = document.getElementById('output');
var distance = response.routes[0].legs[0].distance.text;
var duration = response.routes[0].legs[0].duration.text;
var fromLoc = response.routes[0].legs[0].start_address;
var toLoc = response.routes[0].legs[0].end_address;
var steps = 'From '+fromLoc+' to '+toLoc+' can be reached by below route in '+duration+ ' travelling '+ distance +'<br/>';
for (var i = 0; i < response.routes[0].legs[0].steps.length; i++) {
steps += response.routes[0].legs[0].steps[i].instructions + " For "+response.routes[0].legs[0].steps[i].distance.text + "<br/>";
}
outputDiv.innerHTML = steps;
}
});
});
function initMap() {
console.log('Map init');
map = new google.maps.Map(document.getElementById('map'), {
center: { lat: 19.02, lng: 72.87 },
zoom: 12
});
}
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAe46uoFVEaPTJJ3VQhFB-nOuXpRKGWwbE&callback=initMap">
</script>
</body>