Ok, I'll admit I'm nowhere near the best programmer on the planet -
and I'm used to the answer staring me right in the face but not making
sense of it.

* Problem

I need to display multiple markers on a map, each with their own
infowindow. I have created the individual markers without a problem,
but don't know how to create the infowindows for each.

* Steps so far

I am generating a map using the V3 API within an ASP-based website,
with markers being created from a set of DB records. The markers are
created by looping through a rs and defining a marker() with the
relevant variables:

                var myLatlng = new google.maps.LatLng(lat,long);
                var marker = new google.maps.Marker({
                        map: map,
                        position: myLatlng,
                        title: 'locationname',
                        icon: 
'http://google-maps-icons.googlecode.com/files/park.png'
                });

This is creating all the relevant markers in their correct locations.

What I need to do now, and am not sure of how to achieve is give each
of them their own unique infowindow which I can use to display
information and links relevant to that marker.

* Source

<script type="text/javascript" src="http://maps.google.com/maps/api/js?
sensor=false"></script>
<script language="javascript">
  $(document).ready(function() {

        //Google Maps
    var myOptions = {
      zoom: 5,
      center: new google.maps.LatLng(-26.66, 122.25),
                        mapTypeControl: false,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
                        navigationControl: true,
                        navigationControlOptions: {
                          style: google.maps.NavigationControlStyle.SMALL
                        }

    }

    var map = new
google.maps.Map(document.getElementById("map_canvas"), myOptions);

                <!-- While locations_haslatlong not BOF.EOF -->
        <% While ((Repeat1__numRows <> 0) AND (NOT
locations_haslatlong.EOF)) %>
                var myLatlng = new google.maps.LatLng(<
%=(locations_haslatlong.Fields.Item("llat").Value)%>,<
%=(locations_haslatlong.Fields.Item("llong").Value)%>);
                var marker = new google.maps.Marker({
                        map: map,
                        position: myLatlng,
                        title: 
'<%=(locations_haslatlong.Fields.Item("ldescription").Value)
%>',
                        icon: 
'http://google-maps-icons.googlecode.com/files/park.png',
                        clickable: true,
                });
                <%
                Repeat1__index=Repeat1__index+1
                Repeat1__numRows=Repeat1__numRows-1
                locations_haslatlong.MoveNext()
                Wend
                %>
        <!-- End While locations_haslatlong not BOF.EOF -->

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

                google.maps.event.addListener(marker, 'dblclick', function() {
                map.setZoom(14);
                });


  });
</script>

-- 
You received this message because you are subscribed to the Google Groups 
"Google Maps JavaScript API v3" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to 
[email protected].
For more options, visit this group at 
http://groups.google.com/group/google-maps-js-api-v3?hl=en.

Reply via email to