Maps v3, checkbox, mysql parsing.

      var side_bar_html = ""; 

      var gmarkers = [];
      var gicons = [];
      var map = null;

var infowindow = new google.maps.InfoWindow(
  { 
    size: new google.maps.Size(150,50)
  });


gicons["red"] = new google.maps.MarkerImage("mapIcons/marker_red.png",
      // This marker is 20 pixels wide by 34 pixels tall.
      new google.maps.Size(20, 34),
      // The origin for this image is 0,0.
      new google.maps.Point(0,0),
      // The anchor for this image is at 9,34.
      new google.maps.Point(9, 34));
  // Marker sizes are expressed as a Size of X,Y
  // where the origin of the image (0,0) is located
  // in the top left of the image.
 
  // Origins, anchor positions and coordinates of the marker
  // increase in the X direction to the right and in
  // the Y direction down.

  var iconImage = new google.maps.MarkerImage('mapIcons/marker_red.png',
      // This marker is 20 pixels wide by 34 pixels tall.
      new google.maps.Size(20, 34),
      // The origin for this image is 0,0.
      new google.maps.Point(0,0),
      // The anchor for this image is at 9,34.
      new google.maps.Point(9, 34));
  var iconShadow = new google.maps.MarkerImage('http://www.google.com/mapfiles/shadow50.png',
      // The shadow image is larger in the horizontal dimension
      // while the position and offset are the same as for the main image.
      new google.maps.Size(37, 34),
      new google.maps.Point(0,0),
      new google.maps.Point(9, 34));
      // Shapes define the clickable region of the icon.
      // The type defines an HTML <area> element 'poly' which
      // traces out a polygon as a series of X,Y points. The final
      // coordinate closes the poly by connecting to the first
      // coordinate.
;

function getMarkerImage(iconColor) {
   if ((typeof(iconColor)=="undefined") || (iconColor==null)) { 
      iconColor = "red"; 
   }
   if (!gicons[iconColor]) {
      gicons[iconColor] = new google.maps.MarkerImage("mapIcons/marker_"+ iconColor +".png",
      // This marker is 20 pixels wide by 34 pixels tall.
      new google.maps.Size(20, 34),
      // The origin for this image is 0,0.
      new google.maps.Point(0,0),
      // The anchor for this image is at 6,20.
      new google.maps.Point(9, 34));
   } 
   return gicons[iconColor];

}

function category2color(type) {
   var color = "red";
   switch(type) {
     case "cz": color = "blue";
                break;
     case "sk":    color = "green";
                break;
     default:   color = "red";
                break;
   }
   return color;
}

      gicons["cz"] = getMarkerImage(category2color("cz"));
      gicons["sk"] = getMarkerImage(category2color("sk"));
      

      // A function to create the marker and set up the event window
function createMarker(point,nick,html,type) {
    var contentString = html;
    var marker = new google.maps.Marker({
        position: point,
        icon: gicons[type],
        shadow: iconShadow,
        map: map,
        title: nick
        });
        // === Store the category and name info as a marker properties ===
        marker.mycategory = type;                                 
        marker.myname = nick;
        gmarkers.push(marker);

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

      // == shows all markers of a particular category, and ensures the checkbox is checked ==
      function show(type) {
        for (var i=0; i<gmarkers.length; i++) {
          if (gmarkers[i].mycategory == type) {
            gmarkers[i].setVisible(true);
          }
        }
        // == check the checkbox ==
        document.getElementById(type+"box").checked = true;
      }

      // == hides all markers of a particular category, and ensures the checkbox is cleared ==
      function hide(type) {
        for (var i=0; i<gmarkers.length; i++) {
          if (gmarkers[i].mycategory == type) {
            gmarkers[i].setVisible(false);
          }
        }
        // == clear the checkbox ==
        document.getElementById(type+"box").checked = false;
        // == close the info window, in case its open on a marker that we just hid
        infowindow.close();
      }

      // == a checkbox has been clicked ==
      function boxclick(box,type) {
        if (box.checked) {
          show(type);
        } else {
          hide(type);
        }
        // == rebuild the side bar
        makeSidebar();
      }

      function myclick(i) {
        google.maps.event.trigger(gmarkers[i],"click");
      }


      // == rebuilds the sidebar to match the markers currently displayed ==
      function makeSidebar() {
        var html = "";

        for (var i=0 ; i<gmarkers.length; i++) {
          if (gmarkers[i].getVisible()) {
         html += '<a href="javascript:myclick(' + i + ')">' + gmarkers[i].myname + '<\/a><br>';
          }
        }
        document.getElementById("side_bar").innerHTML = html;
      }

  function initialize() {
    var myOptions = {
      zoom: 11,
      center: new google.maps.LatLng(53.8363,-3.0377),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map"), myOptions);


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



      // Read the data   
     <?php                                    
 $query = mysql_query("SELECT * FROM data1");
while ($row = mysql_fetch_array($query)){
 $id=$row['id'];
 $lat=$row['lat'];
 $lng=$row['lng'];
 $type=$row['type'];
 $server=$row['server'];
 $nick=$row['nick'];
 $jmeno=$row['jmeno'];
 $mesto=$row['mesto'];
 $ulice=$row['ulice'];
 $vek=$row['vek'];
 $stat=$row['stat'];
 $icq=$row['kicq'];
 $skype=$row['kskype'];
 $email=$row['kemail'];
 
       echo "\n var point = new GLatLng(".$lat.",".$lng.");\n";
             echo "var marker = createMarker(point,'$nick','$vek','$type');\n";
       echo "map.addOverlay(marker);\n";
  }        
 ?>  

        // == show or hide the categories initially ==
        show("cz");
        hide("sk");
        
        // == create the initial sidebar ==
        makeSidebar();
      });
    }

    // This Javascript is based on code provided by the
    // Community Church Javascript Team
    // http://www.bisphamchurch.org.uk/   
    // http://econym.org.uk/gmap/
    // from the v2 tutorial page at:
    // http://econym.org.uk/gmap/example_categories.htm
    //]]>
    </script>