CODEWITHSUNDEEP
javascriptgoogle-mapsgoogle-maps-api-3infowindow
Code Lღver
Code Lღver

Reputation: 15603

want to get the contents of infobubble of a marker?

I am using gmap v3. I am facing a problem. The problem is that I am creating dynamically marker and at similar time I am creating the infowindow of that marker. Now I want to add some contents in any infowindow of a marker. But don't know how i can get the content of a infowindow. I have stored my markers objects in a array and also infowindow's objects. But not found any solution.

I want to get infowindow's content on the basis of marker.

EDIT:

var markerArray = new Array();
var infoArray = new Array();

function placemarker(point,id, contents){
var marker = new google.maps.Marker({
    icon: image,
    position: point, 
    map: map,
    title: name
});

markerArray[id] = marker;

var infoBubble = new InfoBubble();
var content = contents;
infoBubble.setContent(content);
google.maps.event.addListener(marker,"mouseover",function(event){
    for(var i=0; i < infoArray.length ; i++ )
    infoArray[i].close();
    infoBubble.open(map,marker);
});
infoArray.push(infoBubble);
}

This function is called within a function many time that create marker on map. now on a condition two markers are at same lat long and I want to show single marker with infowindow of both markers content. I have able to create single marker but not able to append the content in a info window.

Upvotes: 7

Views: 2494

Answers (3)

Julian D.
Julian D.

Reputation: 5463

If you are already keeping all the InfoWindow's in your infoArray, why don't you simply store them with the same id as you do with your markers?

var markers = {};
var infoWindows = {};

function placemarker(point, id, contents) {
    var marker = ...
    ...
    markers[id] = marker;

    var infoWindow = ...
    ...
    infoWindows[id] = infoWindow;
}

(Note that I have replaced your arrays with hashes.) Now you can access every marker's InfoWindow (and its content via getContent()) the same way you access the marker itself.

Upvotes: 2

Bj&#246;rn
Bj&#246;rn

Reputation: 1601

I don't think it is possible to search for a marker in a google maps (which I think is what you are trying to do).

Do you need to create two markers when they anyway are on the same point? If no I would just keep track of the infoBubbles in an array where the point coordinates is the key. So before you create a new infoBubble you check if you already have one and if that is the case you just replace it with a new combined infoBubble.

Here is a code draft.

if(infoArray[point.lat+'_'+point.lng] != undefined){
    tmpBubble = infoArray[point.lat+'_'+point.lng];
    infoBubble = createCombinedBubble(tmpBubble, infoBubble);
}
infoArray[point.lat+'_'+point.lng] = infoBubble;

Upvotes: 1

Henesnarfel
Henesnarfel

Reputation: 2139

This is pretty old but figured I would give this a shot

I'm not sure what InfoBubble is for my example I'm using InfoWindow.

function createMarker(objPoint) 
{ 
    objPoint = new google.maps.LatLng(strLat, strLng);

    strFromHtml = 'Your HTML';

    //creates the window with the options
    objInfoWindow = new google.maps.InfoWindow(
    {
        content: strToHtml,
        maxWidth: 250,
        zIndex: -1
    });

    var markerOptions = 
    {
       position: objPoint,
       map: objMap
    }

    objMarker = new google.maps.Marker(markerOptions);

    //if the marker is clicked open the window
    google.maps.event.addListener(objMarker, "click", function() 
    {
        objInfoWindow.open(objMap, objMarker);
    });
}

I first create the window, then the marker, I then attach a click listener for the marker to display the infowindow on it when the marker is clicked. You could take the click out and just display it but for my purposes I wanted them to have to click it.

EDIT

Ok I've reread your question about 50 times and I hope this solution is good. As for the multiple markers in one location I don't have an answer for that. I think I have an answer for the multiple markers with its own info. If this doesn't work then you are gonna have to create an example in jsfiddle or something otherwise I don't understand what you want. Check it out here jsfiddle

When creating the infoWindow you only create it once holding default content. So put it in the initialization of the map itself. Then when creating the markers you can use the marker itself to contain the html for the infowindow to show.

var markerOptions =
{
  position: objPoint,
  map: objMap,
  html: strHtml//added to make the marker object store the content of the infowindow
}

Then in your mouseover listener you use this.html to get the content for the infowindow

google.maps.event.addListener(objMarker, "mouseover", function()
{
  objInfoWindow.setContent(this.html);
  objInfoWindow.open(objMap, this);
});

As for the multiple markers in one spot. I would have to say programmatically you are gonna have to catch this and only create one marker with the content of both in one marker.

Upvotes: 2

Related Questions