There is an easier way:
google.maps.event.addListener(marker, 'click', function () {
infowindow.open(map, this);
});
Since the event is bound to the marker the 'this' keyword is a representation
of the marker clicked.
Also to display different content in the inforwindow save the content as a
property of the markers.
marker.content = '<h1>Hello world</h1>'
So:
marker.content = '<h1>Hello world</h1>'
google.maps.event.addListener(marker, 'click', function () {
infowindow.setContent(this.content)
infowindow.open(map, this);
});
..fredrik
On 20 maj 2010, at 07.06, Chad Killingsworth wrote:
> This is a common issue. A good explanation of what is happening can be
> found here:
> http://groups.google.com/group/google-maps-js-api-v3/browse_thread/thread/f40390e4a6ba89e9/25a246d92f93e9ea
>
> Try this code snippet. You'll also need to place it inside your loop:
>
> google.maps.event.addListener(marker, 'click', (function(thisMarker) {
> return function() { infowindow.open(map, thisMarker); };
> })(marker));
>
> Chad Killingsworth
>
> On May 19, 9:22 pm, Michael Harris <[email protected]>
> wrote:
>> 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
>> athttp://groups.google.com/group/google-maps-js-api-v3?hl=en.
>
> --
> 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.
>
--
Fredrik Bonander
[email protected]
+46 70 943 5441
- the infinite power of the creative mind -
--
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.
