
?>
    <style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }
    </style>
    

 <script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCd2Ax22mkgPZvMkEZHzgKE3jtI4EeoL2A&sensor=false">
    </script>

    <script>


function initialize() {

  // Create an array of styles.


  var styles = [
    {
      stylers: [
        { hue: "#00ffe6" },
        { saturation: -20 }
      ]
    },{
      featureType: "road",
      elementType: "geometry",
      stylers: [
        { lightness: 100 },
        { visibility: "simplified" }
      ]
    },
{
    featureType: "road.arterial",
    elementType: "geometry",
    stylers: [
      { hue: "#00ffee" },
      { saturation: 50 }
    ]
  },

{
    featureType: "poi",
    elementType: "labels",
    stylers: [
      { visibility: "off" }
    ]
  },

{
    featureType: "water",
  //  elementType: "all",
    stylers: [
    { hue: "#00ff77" },
 { lightness: -75 },
{ saturation: -50 },
 { visibility: "on" }
    ]
  },

{
      featureType: "road",
      elementType: "labels",
      stylers: [
        { visibility: "on" }
      ]
    }
  ];






  // Create a new StyledMapType object, passing it the array of styles,
  // as well as the name to be displayed on the map type control.


// per i contenuti di testo

var contentString = '<div id="content">'+
      '<div id="siteNotice">'+
      '</div>'+
      '<h1 id="firstHeading" class="firstHeading">visualizingvenice.org</h1>'+
      '<div id="bodyContent">'+
      '<p><b>test</b>, We are a group of Faculty and graduate students in Architecture, Architectural and Urban History, and Engineering who seek to show how urban space evolves over time. Our project is educational and experimental, but we also hope that it will become a mode of public outreach that can explain place and space as evolving process. Visualizing Venice is a series of inquiries into how social and economic change shaped the city of Venice over time. Using documents and archival sources, collaborative groups of students map and model the process of change in the city.</p>'+
      '<a href="http://visualizingvenice.org/">http://visualizingvenice.org/</a></div>'+
      '</div>';

  var infowindow = new google.maps.InfoWindow({
      content: contentString
  });


  var styledMap = new google.maps.StyledMapType(styles,
    {name: "VISU"});

//inserisco coordinate
var myLatlng1 = new google.maps.LatLng(45.439, 12.3430);
var myLatlng2 = new google.maps.LatLng(45.44, 12.3445);

var bound1 = new google.maps.LatLng(45.43, 12.31);
var bound2 = new google.maps.LatLng(45.45, 12.37);

//questa è l'opacità
 var overlayOpts = {
      opacity:0.7
  }


var image = 'images/logo.png';

//per immagine
var imageBounds = new google.maps.LatLngBounds(
     
      bound1,
 bound2);






  // Create a map object, and include the MapTypeId to add
  // to the map type control.
  var mapOptions = {
    zoom: 16,
    center: myLatlng1,
    mapTypeControlOptions: {
      mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style']
    }
  };
  var map = new google.maps.Map(document.getElementById('map-canvas'),
    mapOptions);

 historicalOverlay = new google.maps.GroundOverlay(
      'images/lagunatemp.jpg',
      imageBounds, overlayOpts);
  historicalOverlay.setMap(map);


  //Associate the styled map with the MapTypeId and set it to display.
  map.mapTypes.set('map_style', styledMap);
  map.setMapTypeId('map_style');

 var marker = new google.maps.Marker({
      position: myLatlng1,
      map: map,
icon: image,
      title: 'uno!'
  });

 var marker = new google.maps.Marker({
      position: myLatlng2,
      map: map,
icon: image,
      title: 'uno!'
  });

google.maps.event.addListener(marker, 'click', function() {
    infowindow.open(map,marker);
  });


}


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

    </script>
 
    <div id="map-canvas"></div>
  
<?
