Google Map - Marker + Info

by DustyWhite

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<h1>Map of Harvard Yard</h1>
<div id="map-canvas"></div>

CSS

html,body,#map-canvas {
    height: 100%;
    margin: 0px;
    padding: 0px
}

JavaScript

var harvard_yard_map;

/* John Harvard Statue map location
42.374474,-71.117207 */
var statue_latlng = new google.maps.LatLng(42.374474, -71.117207);

/* Northwest Building map location
42.374474,-71.117207 */
var northwestbldg_latlng= new google.maps.LatLng(42.3795462, -71.1156024);


function initialize() {
    var mapOptions = {
        zoom: 16,
        center: /* ==OLD, REPLACED & RECENTERED TO 1 Oxford St.== statue_latlng */ 
        new google.maps.LatLng(42.376921, -71.115937)
    };
    harvard_yard_map = new google.maps.Map(document.getElementById('map-canvas'),
    mapOptions);
    
    // John Harvard Statue specific:
    var statue_info = "<strong>John Harvard Statue</strong><br/>" +
        "<a href='https://www.summer.harvard.edu/inside-summer/3-lies-harvard'>3 Lies of Harvard</a>";
    
    var statue_infowindow = new google.maps.InfoWindow({
        content: statue_info
    });   
    
    var statue_marker = new google.maps.Marker({
      position: statue_latlng,
      map: harvard_yard_map,
      title: 'John Harvard Statue'
    });
    
    google.maps.event.addListener(statue_marker, 'click', function() {
      statue_infowindow.open(harvard_yard_map,statue_marker);
    });

    // Northwest Building specific:
    var northwestbldg_info = "<strong>Northwest Building</strong><br/>" +
        "<a href='https://www.seas.harvard.edu/tour/northwest-building'>John A. Paulson School of Engineering and Applied Sciences</a>";
    
    var northwestbldg_infowindow = new google.maps.InfoWindow({
        content: northwestbldg_info
    });   
    
    var northwestbldg_marker = new google.maps.Marker({
      position: northwestbldg_latlng,
      map: harvard_yard_map,
      title: 'Northwest Building'
    });
    
    google.maps.event.addListener(northwestbldg_marker, 'click', function() {
      northwestbldg_infowindow.open(harvard_yard_map,northwestbldg_marker);
    });


}

google.maps.event.addDomListener(window, 'load', initialize);