//<![CDATA[

    if (GBrowserIsCompatible()) {
      var side_bar_html = "<table border=0 cellpadding=0><tr>";
      var gmarkers = [];
      var i = 0;

            var icon0 = new GIcon();
      icon0.image = "images/googlemaps/icons/airport.jpg";
      icon0.iconSize = new GSize(17, 16);
      icon0.iconAnchor = new GPoint(10, 10);
      icon0.infoWindowAnchor = new GPoint(10, 10);

      var icon1 = new GIcon();
      icon1.image = "images/googlemaps/icons/boat.jpg";
      icon1.iconSize = new GSize(17, 16);
      icon1.iconAnchor = new GPoint(10, 10);
      icon1.infoWindowAnchor = new GPoint(10, 10);

      var icon2 = new GIcon();
      icon2.image = "images/googlemaps/icons/church.jpg";
      icon2.iconSize = new GSize(17, 16);
      icon2.iconAnchor = new GPoint(10, 10);
      icon2.infoWindowAnchor = new GPoint(10, 10);

      var icon3 = new GIcon();
      icon3.image = "images/googlemaps/icons/employment.jpg";
      icon3.iconSize = new GSize(17, 16);
      icon3.iconAnchor = new GPoint(10, 10);
      icon3.infoWindowAnchor = new GPoint(10, 10);

      var icon4 = new GIcon();
      icon4.image = "images/googlemaps/icons/family.png";
      icon4.iconSize = new GSize(17, 16);
      icon4.iconAnchor = new GPoint(10, 10);
      icon4.infoWindowAnchor = new GPoint(10, 10);

      var icon5 = new GIcon();
      icon5.image = "images/googlemaps/icons/fire.jpg";
      icon5.iconSize = new GSize(17, 16);
      icon5.iconAnchor = new GPoint(10, 10);
      icon5.infoWindowAnchor = new GPoint(10, 10);

      var icon6 = new GIcon();
      icon6.image = "images/googlemaps/icons/general.png";
      icon6.iconSize = new GSize(17, 16);
      icon6.iconAnchor = new GPoint(10, 10);
      icon6.infoWindowAnchor = new GPoint(10, 10);

      var icon7 = new GIcon();
      icon7.image = "images/googlemaps/icons/golf.jpg";
      icon7.iconSize = new GSize(17, 16);
      icon7.iconAnchor = new GPoint(10, 10);
      icon7.infoWindowAnchor = new GPoint(10, 10);

      var icon8 = new GIcon();
      icon8.image = "images/googlemaps/icons/government.jpg";
      icon8.iconSize = new GSize(17, 16);
      icon8.iconAnchor = new GPoint(10, 10);
      icon8.infoWindowAnchor = new GPoint(10, 10);

      var icon9 = new GIcon();
      icon9.image = "images/googlemaps/icons/hospital.jpg";
      icon9.iconSize = new GSize(17, 16);
      icon9.iconAnchor = new GPoint(10, 10);
      icon9.infoWindowAnchor = new GPoint(10, 10);

      var icon10 = new GIcon();
      icon10.image = "images/googlemaps/icons/info.jpg";
      icon10.iconSize = new GSize(17, 16);
      icon10.iconAnchor = new GPoint(10, 10);
      icon10.infoWindowAnchor = new GPoint(10, 10);

      var icon11 = new GIcon();
      icon11.image = "images/googlemaps/icons/library.jpg";
      icon11.iconSize = new GSize(17, 16);
      icon11.iconAnchor = new GPoint(10, 10);
      icon11.infoWindowAnchor = new GPoint(10, 10);

      var icon12 = new GIcon();
      icon12.image = "images/googlemaps/icons/military.jpg";
      icon12.iconSize = new GSize(17, 16);
      icon12.iconAnchor = new GPoint(10, 10);
      icon12.infoWindowAnchor = new GPoint(10, 10);

      var icon13 = new GIcon();
      icon13.image = "images/googlemaps/icons/museum.jpg";
      icon13.iconSize = new GSize(17, 16);
      icon13.iconAnchor = new GPoint(10, 10);
      icon13.infoWindowAnchor = new GPoint(10, 10);

      var icon14 = new GIcon();
      icon14.image = "images/googlemaps/icons/park.jpg";
      icon14.iconSize = new GSize(17, 16);
      icon14.iconAnchor = new GPoint(10, 10);
      icon14.infoWindowAnchor = new GPoint(10, 10);

      var icon15 = new GIcon();
      icon15.image = "images/googlemaps/icons/police.jpg";
      icon15.iconSize = new GSize(17, 16);
      icon15.iconAnchor = new GPoint(10, 10);
      icon15.infoWindowAnchor = new GPoint(10, 10);

      var icon16 = new GIcon();
      icon16.image = "images/googlemaps/icons/school.jpg";
      icon16.iconSize = new GSize(17, 16);
      icon16.iconAnchor = new GPoint(10, 10);
      icon16.infoWindowAnchor = new GPoint(10, 10);

      var icon17 = new GIcon();
      icon17.image = "images/googlemaps/icons/service.png";
      icon17.iconSize = new GSize(17, 16);
      icon17.iconAnchor = new GPoint(10, 10);
      icon17.infoWindowAnchor = new GPoint(10, 10);

      var icon18 = new GIcon();
      icon18.image = "images/googlemaps/icons/shopping.jpg";
      icon18.iconSize = new GSize(17, 16);
      icon18.iconAnchor = new GPoint(10, 10);
      icon18.infoWindowAnchor = new GPoint(10, 10);

      var icon19 = new GIcon();
      icon19.image = "images/googlemaps/icons/wateractivities.png";
      icon19.iconSize = new GSize(17, 16);
      icon19.iconAnchor = new GPoint(10, 10);
      icon19.infoWindowAnchor = new GPoint(10, 10);

      var icon20 = new GIcon();
      icon20.image = "images/googlemaps/icons/youth.png";
      icon20.iconSize = new GSize(17, 16);
      icon20.iconAnchor = new GPoint(10, 10);
      icon20.infoWindowAnchor = new GPoint(10, 10);



      // An array of GIcons, to make the selection easier
      var icons = [];
      icons[0] = icon0;
icons[1] = icon1;
icons[2] = icon2;
icons[3] = icon3;
icons[4] = icon4;
icons[5] = icon5;
icons[6] = icon6;
icons[7] = icon7;
icons[8] = icon8;
icons[9] = icon9;
icons[10] = icon10;
icons[11] = icon11;
icons[12] = icon12;
icons[13] = icon13;
icons[14] = icon14;
icons[15] = icon15;
icons[16] = icon16;
icons[17] = icon17;
icons[18] = icon18;
icons[19] = icon19;
icons[20] = icon20;


      var tdrow = 1;
      // A function to create the marker and set up the event window
      function createMarker(point,label,html,icontype,iname) {
 
        var marker = new GMarker(point, icons[icontype]);
        GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml(html);
        });
        // save the info we need to use later for the side_bar
        gmarkers.push(marker)
        // add a line to the side_bar html
        side_bar_html += '<td class=cbhp width=19 valign=top align=left><img width=17 height=16 src=/images/googlemaps/icons/' + iname + '></td><td class=cbhp width=215 valign=top align=left><a href="javascript:myclick(' + (gmarkers.length-1) + ')";>' + label + '</a></td>';
        tdrow++;
        if (tdrow > 3){side_bar_html += '</tr><tr>'; tdrow =1;
         }
        return marker;
      }      
 
      function myclick(i) {
        GEvent.trigger(gmarkers[i], "click");
      }
      
      // built by script 
 
      var map = new GMap2(document.getElementById("map"),  { size: new GSize(550,450) } );
      
      map.addControl(new GLargeMapControl3D());
      map.addControl(new GMapTypeControl());
      map.setMapType(G_HYBRID_MAP);
      map.setCenter(new GLatLng(30.65799,-86.6903), 9);

            var lat = "30.73128";
      var lng = "-86.8749";
      var point = new GLatLng(lat,lng);
      var html = "<table width=300 cellspacing=0 cellpadding=3 ><tr><td colspan=2><a class=verd href=http://www.floridastateparks.org/ target=_blank> Blackwater Heritage Trail State Park</a></td></tr><tr><td width=150 valign=top><div class=img-shadow><a class=verd href=http://www.floridastateparks.org/ target=_blank><img border=0 width=120 height=80 src=http://www.welcometonorthwestflorida.com/images/googlemaps/thumbnails/370.jpg></a></div></td><td width=150 valign=top><span class=cbhp >Bicycling, Birding, Horse Trails, Nature Trails, Picnicking, Visitor Center Nature Trails with 8.5-mile paved trail winds through the town of Milton and ends at Whiting Field Naval Air Station.  <br><br>7720 Deaton Bridge Road <br>Holt, FL </span></td></tr></table>";
      var label = "Blackwater Heritage Trail State Park";
      var icontype = '14';
      var marker = createMarker(point,label,html,icontype,'park.jpg');
      map.addOverlay(marker);
      var lat = "30.75913";
      var lng = "-86.5639";
      var point = new GLatLng(lat,lng);
      var html = "<table width=300 cellspacing=0 cellpadding=3 ><tr><td colspan=2><a class=verd href=http://www.cityofcrestview.org/departments/leisure_services.htm target=_blank> Crestview Parks & Recreation Dept.</a></td></tr><tr><td width=150 valign=top><div class=img-shadow><a class=verd href=http://www.cityofcrestview.org/departments/leisure_services.htm target=_blank><img border=0 width=120 height=80 src=http://www.welcometonorthwestflorida.com/images/googlemaps/thumbnails/378.jpg></a></div></td><td width=150 valign=top><span class=cbhp ><br><br>100 N. Hathaway St. <br>Crestview, FL </span></td></tr></table>";
      var label = "Crestview Parks & Recreation Dept.";
      var icontype = '14';
      var marker = createMarker(point,label,html,icontype,'park.jpg');
      map.addOverlay(marker);
      var lat = "30.32890";
      var lng = "-86.1551";
      var point = new GLatLng(lat,lng);
      var html = "<table width=300 cellspacing=0 cellpadding=3 ><tr><td colspan=2><a class=verd href=http://www.floridastateparks.org/ target=_blank> Deer Lake State Park</a></td></tr><tr><td width=150 valign=top><div class=img-shadow><a class=verd href=http://www.floridastateparks.org/ target=_blank><img border=0 width=120 height=80 src=http://www.welcometonorthwestflorida.com/images/googlemaps/thumbnails/371.jpg></a></div></td><td width=150 valign=top><span class=cbhp >Discover one of the most beautiful beaches in Northwest Florida! Facilities are limited at Deer Lake State Park. The pristine beach and beautiful coastal dune lake are worth the walk! Enjoy the tranquility of Deer Lake State Park! <br><br>357 Main Park Road <br>Santa Rosa Beach, FL </span></td></tr></table>";
      var label = "Deer Lake State Park";
      var icontype = '14';
      var marker = createMarker(point,label,html,icontype,'park.jpg');
      map.addOverlay(marker);
      var lat = "30.40467";
      var lng = "-86.6192";
      var point = new GLatLng(lat,lng);
      var html = "<table width=300 cellspacing=0 cellpadding=3 ><tr><td colspan=2><a class=verd href=http://www.fwb.org/index.php/parks-and-recreation.html target=_blank> Fort Walton Beach Parks & Recreation Dept.</a></td></tr><tr><td width=150 valign=top><div class=img-shadow><a class=verd href=http://www.fwb.org/index.php/parks-and-recreation.html target=_blank><img border=0 width=120 height=80 src=http://www.welcometonorthwestflorida.com/images/googlemaps/thumbnails/377.jpg></a></div></td><td width=150 valign=top><span class=cbhp ><br><br>107 Miracle Strip Parkway SW <br>Fort Walton Beach, FL </span></td></tr></table>";
      var label = "Fort Walton Beach Parks & Recreation Dept.";
      var icontype = '14';
      var marker = createMarker(point,label,html,icontype,'park.jpg');
      map.addOverlay(marker);
      var lat = "30.49896";
      var lng = "-86.4305";
      var point = new GLatLng(lat,lng);
      var html = "<table width=300 cellspacing=0 cellpadding=3 ><tr><td colspan=2><a class=verd href=http://www.floridastateparks.org/ target=_blank> Fred Gannon Rocky Bayou State Park</a></td></tr><tr><td width=150 valign=top><div class=img-shadow><a class=verd href=http://www.floridastateparks.org/ target=_blank><img border=0 width=120 height=80 src=http://www.welcometonorthwestflorida.com/images/googlemaps/thumbnails/372.jpg></a></div></td><td width=150 valign=top><span class=cbhp >Fred Gannon Rocky Bayou State Park was acquired in 1966 through a lease agreement with the U.S. Forest Service, this 357-acre recreation area was named for U.S. Air Force Colonel Fred Gannon who was instrumental in the construction of the park.<br><br>4281 Hwy 20 <br>Niceville, FL </span></td></tr></table>";
      var label = "Fred Gannon Rocky Bayou State Park";
      var icontype = '14';
      var marker = createMarker(point,label,html,icontype,'park.jpg');
      map.addOverlay(marker);
      var lat = "30.32890";
      var lng = "-86.1551";
      var point = new GLatLng(lat,lng);
      var html = "<table width=300 cellspacing=0 cellpadding=3 ><tr><td colspan=2><a class=verd href=http://www.floridastateparks.org/ target=_blank> Grayton Beach State Park</a></td></tr><tr><td width=150 valign=top><div class=img-shadow><a class=verd href=http://www.floridastateparks.org/ target=_blank><img border=0 width=120 height=80 src=http://www.welcometonorthwestflorida.com/images/googlemaps/thumbnails/373.jpg></a></div></td><td width=150 valign=top><span class=cbhp >The park currently maintains 37 Campsites, and 30 Cabins. Overnight visitation is increasing in its popularity here at Grayton, so make reservations early. The management and staff are looking forward to meeting new visitors as well as welcoming back our <br><br>357 Main Park Road <br>Santa Rosa Beach, FL </span></td></tr></table>";
      var label = "Grayton Beach State Park";
      var icontype = '14';
      var marker = createMarker(point,label,html,icontype,'park.jpg');
      map.addOverlay(marker);
      var lat = "30.38481";
      var lng = "-86.4428";
      var point = new GLatLng(lat,lng);
      var html = "<table width=300 cellspacing=0 cellpadding=3 ><tr><td colspan=2><a class=verd href=http://www.floridastateparks.org/ target=_blank> Henderson Beach State Park</a></td></tr><tr><td width=150 valign=top><div class=img-shadow><a class=verd href=http://www.floridastateparks.org/ target=_blank><img border=0 width=120 height=80 src=http://www.welcometonorthwestflorida.com/images/googlemaps/thumbnails/374.jpg></a></div></td><td width=150 valign=top><span class=cbhp >One of the most beautiful sights while visiting the park is a breathtaking view of a Dolphin family (porpoise) as they emerge from the waters for a breath of air, or a group of Rays as they soar across the shallow waters along the coastline. <br><br>17000 Emerald Coast Parkway <br>Destin, FL </span></td></tr></table>";
      var label = "Henderson Beach State Park";
      var icontype = '14';
      var marker = createMarker(point,label,html,icontype,'park.jpg');
      map.addOverlay(marker);
      var lat = "30.52100";
      var lng = "-86.4788";
      var point = new GLatLng(lat,lng);
      var html = "<table width=300 cellspacing=0 cellpadding=3 ><tr><td colspan=2><a class=verd href=http://www.cityofniceville.org/recreationhm.html target=_blank> Niceville Parks & Recreation Dept.</a></td></tr><tr><td width=150 valign=top><div class=img-shadow><a class=verd href=http://www.cityofniceville.org/recreationhm.html target=_blank><img border=0 width=120 height=80 src=http://www.welcometonorthwestflorida.com/images/googlemaps/thumbnails/376.jpg></a></div></td><td width=150 valign=top><span class=cbhp ><br><br>212 North Partin Drive <br>Niceville, FL </span></td></tr></table>";
      var label = "Niceville Parks & Recreation Dept.";
      var icontype = '14';
      var marker = createMarker(point,label,html,icontype,'park.jpg');
      map.addOverlay(marker);


      // put the assembled side_bar_html contents into the side_bar div

      function legend() {
       var load = window.open('http://www.welcometonorthwestflorida.com/images/googlemaps/legend1.gif','','scrollbars=no,menubar=no,width=560,height=450,resizable=no,toolbar=no,location=no,status=no');
       }
         side_bar_html += '</tr></table><p align=center><a a href="javascript:legend()">Map Legend</a>';

         document.getElementById("side_bar").innerHTML = side_bar_html;


    }   else
     { alert("Google Maps is not compatible with this browser"); }

    //]]>