Advertisement
contatowellington

Untitled

Oct 18th, 2017
458
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.27 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>CaRtOgRaXaRp1</title>
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  6. <meta charset="utf-8">
  7. <style>
  8. /* Always set the map height explicitly to define the size of the div
  9. * element that contains the map. */
  10. #map {
  11. height: 100%;
  12. }
  13. /* Optional: Makes the sample page fill the window. */
  14. html, body {
  15. height: 100%;
  16. margin: 0;
  17. padding: 0;
  18. }
  19. </style>
  20. </head>
  21. <body>
  22. <div id="map"></div>
  23. <script>
  24. var map;
  25. function initMap() {
  26. map = new google.maps.Map(document.getElementById('map'), {
  27. zoom: 12,
  28. center: new google.maps.LatLng(-3.7887648, -38.5946788),
  29. mapTypeId: 'roadmap'
  30. });
  31.  
  32. var contentString = '<div id="content">'+
  33. '<div id="siteNotice">'+
  34. '</div>'+
  35. '<h1 id="firstHeading" class="firstHeading">Uluru</h1>'+
  36. '<div id="bodyContent">'+
  37. '<p><b>Uluru</b>, also referred to as <b>Ayers Rock</b>, is a large ' +
  38. 'sandstone rock formation in the southern part of the '+
  39. 'Northern Territory, central Australia. It lies 335&#160;km (208&#160;mi) '+
  40. 'south west of the nearest large town, Alice Springs; 450&#160;km '+
  41. '(280&#160;mi) by road. Kata Tjuta and Uluru are the two major '+
  42. 'features of the Uluru - Kata Tjuta National Park. Uluru is '+
  43. 'sacred to the Pitjantjatjara and Yankunytjatjara, the '+
  44. 'Aboriginal people of the area. It has many springs, waterholes, '+
  45. 'rock caves and ancient paintings. Uluru is listed as a World '+
  46. 'Heritage Site.</p>'+
  47. '<p>Attribution: Uluru, <a href="https://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194">'+
  48. 'https://en.wikipedia.org/w/index.php?title=Uluru</a> '+
  49. '(last visited June 22, 2009).</p>'+
  50. '</div>'+
  51. '</div>';
  52.  
  53. var infowindow = new google.maps.InfoWindow({
  54. content: contentString
  55. });
  56.  
  57.  
  58. var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
  59. var icons = {
  60. parking: {
  61. icon: iconBase + 'parking_lot_maps.png'
  62. },
  63. library: {
  64. icon: iconBase + 'library_maps.png'
  65. },
  66. info: {
  67. icon: iconBase + 'info-i_maps.png'
  68. }
  69. };
  70.  
  71. var features = [
  72. {
  73. "Id": 1,
  74. position: new google.maps.LatLng(-3.7887800, -38.5946788),
  75. type: 'info'
  76. },
  77. {
  78. "Id": 2,
  79. position: new google.maps.LatLng(-3.7887648, -38.5946788),
  80. type: 'info'
  81. },
  82. ];
  83.  
  84. // Create markers.
  85. features.forEach(function(feature) {
  86. var marker = new google.maps.Marker({
  87. position: feature.position,
  88. icon: icons[feature.type].icon,
  89. map: map
  90. });
  91. marker.addListener('click', function() {
  92. infowindow.open(map, marker);
  93. });
  94. });
  95. }
  96. </script>
  97. <script async defer
  98. src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCX1FKSQXy-AMLnQvUNNzi5IFJFiR26fBs&callback=initMap">
  99. </script>
  100. </body>
  101. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement