GMap w/ Marker & InfoWindow

by kpowz

HTML

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>Zip Code:
<input type="text" name="address" id="zip" />
<input type="button" id="bSubmit" value="Submit" />&nbsp;
<div id="map_canvas"></div>

CSS

#map_canvas {
    height: 350px;
    width: 500px;
}

JavaScript

function initialize() {
       var data = "Sample bunnies and buses!";
       var title = "Title";
       var latitude = null;
       var longitude = null;
       var addresscity = document.getElementById("zip").value;
       var geocoder = new google.maps.Geocoder();
       geocoder.geocode({
           'address': addresscity
       }, function (results, status) {
           if (status == google.maps.GeocoderStatus.OK) {
               latitude = results[0].geometry.location.lat();
               longitude = results[0].geometry.location.lng();
               var myLatlng = new google.maps.LatLng(latitude, longitude);
               var mapOptions = {
                   center: new google.maps.LatLng(latitude, longitude),
                   zoom: 8,
                   mapTypeId: google.maps.MapTypeId.ROADMAP

               };
               var infoWindow = new google.maps.InfoWindow();
               var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
               var bluePin = new google.maps.MarkerImage('http://maps.google.com/mapfiles/ms/micons/blue-dot.png',
               new google.maps.Size(32, 32),
               new google.maps.Point(0, 0),
               new google.maps.Point(14, 35));
               var pinShadow = new google.maps.MarkerImage('http://maps.google.com/mapfiles/ms/micons/msmarker.shadow.png',
               new google.maps.Size(59, 32),
               new google.maps.Point(0, 0),
               new google.maps.Point(14, 35));
               var marker = new google.maps.Marker({
                   position: myLatlng,
                   icon: bluePin,
                   shadow: pinShadow,
                   map: map,
                   title: title
               });
               (function (marker, data) {
                   google.maps.event.addListener(marker, 'click', function (e) {
                       infoWindow.setContent(data);
                       infoWindow.open(map, marker);
                ...