/
circle.html
100 lines (82 loc) · 2.32 KB
/
circle.html
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
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
var amsterdam=new google.maps.LatLng(-27.573015,153.066695);
var locations = [
['Patient A', -27.563010,153.066695,4],
['Patient B', -27.573019,153.066695,5],
['Patient D', -27.573012,153.066695,2],
['Patient C', -27.563015,153.066695,3],
['Patient E', -27.573030,153.066695,1]
];
//1
function initialize()
{
var mapProp = {
center:amsterdam,
zoom:13,
mapTypeId:google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);
var myCity = new google.maps.Circle({
center:amsterdam,
radius:2000,
strokeColor:"#0000FF",
strokeOpacity:0.8,
strokeWeight:2,
fillColor:"#0000FF",
fillOpacity:0.4
});
var infowindow = new google.maps.InfoWindow();
var i,marker2;
for (i = 0; i < locations.length; i++) {
marker2 = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2] ),
map: map
});
google.maps.event.addListener(marker2, 'click', (function(marker2, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker2);
}
})(marker2, i));
}
var marker = new google.maps.Marker({
position: amsterdam,
title:"Hello World!"
});
myCity.setMap(map);
marker.setMap(map);
marker2.setMap(mapProp);
/*
//Add listener
google.maps.event.addListener(map, "rightclick", function (event) {
var latitude = event.latLng.lat();
var longitude = event.latLng.lng();
//console.log( latitude + ', ' + longitude );
//var p =new google.maps.LatLng(latitude,longitude);
radius = new google.maps.Circle({map: map,
radius: 1000,
center: event.latLng,
fillColor:"#0000FF",
fillOpacity: 0.1,
strokeColor:"#0000FF",
strokeOpacity: 0.8,
strokeWeight: 2,
draggable: true, // Dragable
editable: true // Resizable
});
// Center of map
map.panTo(new google.maps.LatLng(latitude,longitude));
}); //end addListener
*/
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="googleMap" style="width:500px;height:380px;"></div>
</body>
</html>