examples/bootstrap/LocationPicker.html
[roojs1] / examples / bootstrap / LocationPicker.html
1 <!DOCTYPE html>
2 <html>
3   <head>
4     <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
5     <meta charset="utf-8">
6     <title>Simple markers</title>
7     <style>
8       html, body {
9         height: 100%;
10         margin: 0;
11         padding: 0;
12       }
13       #map {
14         height: 100%;
15       }
16     </style>
17   </head>
18   <body>
19     <div id="map"></div>
20     <script>
21
22 function initMap() {
23   var myLatLng = {lat: -25.363, lng: 131.044};
24
25   var map = new google.maps.Map(document.getElementById('map'), {
26     zoom: 4,
27     center: myLatLng
28   });
29
30   var marker = new google.maps.Marker({
31     map: map,
32     draggable: true,
33     animation: google.maps.Animation.DROP,
34     position: {lat: 59.327, lng: 18.067}
35   });
36   marker.addListener('click', toggleBounce);
37 }
38
39 function toggleBounce() {
40   if (marker.getAnimation() !== null) {
41     marker.setAnimation(null);
42   } else {
43     marker.setAnimation(google.maps.Animation.BOUNCE);
44   }
45 }
46
47     </script>
48     <script async defer
49         src="https://maps.googleapis.com/maps/api/js?signed_in=true&callback=initMap"></script>
50   </body>
51 </html>