Create Drop Down for Sleceting Markers in Maps

[Aries]

Hi,

I am a noob when it comes to google maps. I would like to create
something like this.

http://www.barcelona.com/map

Which will show all markers in the same catergory when I choose from
the drop down menu but the problem is I cannot do it. Been working on
it for 5 hours now and I still cannot do it which is very frustrating.

Can someone show me how to do it? or rather send a sample code that
can do the selection. Your help is very much appreciated.

Don't give me a complicated one. A simple one will be enough because
still a noob.

Thank you.


HERE IS THE SCRIPT:


<script type="text/javascript">
    //<![CDATA[

latitude = 48.89364;
longitude = 2.33739;

var mapshow = document.markerType.value;

function initialize() {
        if (GBrowserIsCompatible()) {
                var map = new GMap2(document.getElementById("map_canvas"));
                var bounds = new GLatLngBounds();
                map.setCenter(new GLatLng(latitude,longitude), 16);

                var bounds = map.getBounds();
                var southWest = bounds.getSouthWest();
                var northEast = bounds.getNorthEast();
                var lngSpan = northEast.lng() - southWest.lng();
                var latSpan = northEast.lat() - southWest.lat();

                function createMarker(point,name,html) {
                        var marker = new GMarker(point);
                        GEvent.addListener(marker, "click", function() {
                                marker.openInfoWindowHtml(html);
                        });
                        i++;
                        return marker;
                }


                if (mapshow==1)
                {
                var i = 0;
var markers=new Array(4);
markers[0] = new Array(48.89494,2.33472,"<center>Marker1</center>");
markers[0] = new Array(48.89116,2.33438,"<center>Marker2</center>");
                }

                if (mapshow==2)
                {
                var i = 0;
var markers=new Array(4);
markers[0] = new Array(48.89136,2.34532,"<center>Marker1</center>");
markers[0] = new Array(48.88851,2.34537,"<center>Marker2</center>");
                }

                while (i < markers.length) {
                        var lat = parseFloat(markers[i][0]);
                        var lng = parseFloat(markers[i][1]);
                        var point = new GLatLng(lat,lng);
                        var html = markers[i][2];
                        var label = "";
                        var marker = createMarker(point,label,html);
                        map.addOverlay(marker);
                        bounds.extend(marker.getPoint());
                }

      map.setZoom(map.getBoundsZoomLevel(bounds));
      map.setCenter(bounds.getCenter());

                map.addControl(new GScaleControl());
                map.addControl(new GLargeMapControl());
                map.addControl(new GOverviewMapControl());
                map.addControl(new GMapTypeControl());
        }
}
    //]]>
    </script>


HERE IS WHAT'S IN THE BODY:

  <select name="markerType" onchange="initialize()">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
  </select>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"Google Maps API" group.
To post to this group, send email to Google-Maps-API@googlegroups.com
To unsubscribe from this group, send email to 
google-maps-api+unsubscr...@googlegroups.com
For more options, visit this group at 
http://groups.google.com/group/Google-Maps-API?hl=en
-~----------~----~----~----~------~----~------~--~---