Question

我已经做了一些研究，以确定API v3的标签，并提出了infobubble作为选项卡infowindows的一个好看的来源。我不想弄清楚我是否可以稍后在已经创建的信息块中添加一个标签。我有几个事件从数据库拉到xml然后到java脚本放在地图上，但有些事件共享相同的位置，但其他潜在标记的日期不同。标记或信息窗口是否具有可以迭代的ID，以检查地图的标记是否已存在？然后，如果是这样的话，在信息块/ infowindow中添加一个标签？

我认为infoBubble.addTab(title, content)是这样做的方法，但我怎么知道将它添加到哪个标记/信息块？

更新（这是我的代码，似乎冻结了铬）：

var location_icon = new google.maps.MarkerImage('../images/FAFSA_Logo_icon.png');  
 var map;
 var markersArray= [];
  function load() {

    map = new google.maps.Map(document.getElementById("map"), {
        center: new google.maps.LatLng(33.961586, -106.008728),
        zoom: 6,
        mapTypeId: 'roadmap'
    });
    var infoBubble = new InfoBubble({maxWidth: 300});


    downloadUrl("../site_parts/mapmysql.php", function(data) {
    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("marker");
    for (var i = 0; i < markers.length; i++) {
        var name = markers[i].getAttribute("event_name");
        var address = markers[i].getAttribute("venue_address");
        var city = markers[i].getAttribute("venue_city");
        var state = markers[i].getAttribute("venue_state");
        var zip = markers[i].getAttribute("venue_zip");
        var website = markers[i].getAttribute("venue_website");

        var date = markers[i].getAttribute("event_date");
        var start_time = markers[i].getAttribute("event_start_time");
        var end_time = markers[i].getAttribute("event_end_time");
        var room = markers[i].getAttribute("event_room");
        var cord = markers[i].getAttribute("ec_fname") + " " + markers[i].getAttribute("ec_lname");
        var cord_email = markers[i].getAttribute("ec_email");
        var cord_pnumber = markers[i].getAttribute("ec_pnumber");
        var point = new google.maps.LatLng(
            parseFloat(markers[i].getAttribute("venue_lat")),
            parseFloat(markers[i].getAttribute("venue_lng")));
        var html = "<b>" + name + "</b> <br/>" + address +", "+ city +", "+ state +", "+ zip + "<br/>" +"<b>Date </b> "+ date +"<br/>" +"<b>Time </b> "+ start_time + " - "+ end_time +"<br/>" + "<b>Room </b>" + room + "<br/>"+ "<b> Cordinator </b>" + cord + " " + "<a href='mailto:" + cord_email + "?Subject=FAFSA%20FFA%20Event'>" + cord_email + "</a> " + cord_pnumber;
        var icon =  location_icon;
            for (var i = 0; i < markersArray.length; i++){
                if (markersArray[i].getPosition()=point){
                    addtabFunction(markersArray[i], map, date, html);
                    break;
                } if (i > markersArray.length){continue} else{

            var marker = new google.maps.Marker({map: map, position: point, icon: icon});
                    markersArray.push(marker);
                    bindinfoBubble(marker, map, infoBubble, date, html)
                    break;
                }
            }
        }
    });
  }

function bindinfoBubble(marker, map, infoBubble, date, html) {
  google.maps.event.addListener(marker, 'click', function() {
    infoBubble.addTab(date, html)
    infoBubble.open(map, marker);
  });
}

function addtabFunction (marker, map, date, html){
    infoBubble.open(map, marker);
    infoBubble.addTab(date, html);
}

function downloadUrl(url,callback) {
 var request = window.ActiveXObject ?
    new ActiveXObject('Microsoft.XMLHTTP') :
    new XMLHttpRequest;

request.onreadystatechange = function() {
    if (request.readyState == 4) {
    request.onreadystatechange = doNothing;
    callback(request, request.status);
    }
};

request.open('GET', url, true);
request.send(null);
}

function doNothing() {}

Answer 1

假设已经创建了标记，则以下是您的工作。

google.maps.event.addListener(marker, 'click', function() {
      if (!infoBubble.isOpen()) {
        infoBubble.open(map, marker);
      }
});

来源：View the source of this example

更新：我有点懒于编写代码，但下面是这个想法。这是你在找什么？

// declare and initialise an array of {marker: <marker>, ib: <infoBubble>} prior

for(var i=0; i<markerArray.length; i++ ) {
    if(markerArray[i].marker is already there) {
        markerArray[i].ib.addTab() // or
        markerArray[i].ib.updateTab()
    } else {
        var newMarker = create new marker()
        var newIB = create new inforBubble()

        infoBubble.addTab()
        google.maps.event.addListener(marker, 'click', function() {
            if (!infoBubble.isOpen()) {
            infoBubble.open(map, marker);
        }

        markerArray[i].marker = newMarker
        markerArray[i].ib= newIB
   }
});

Answer 2

我假设您将拥有一个包含latlng的数组，以便将标记放在地图上。因此，针对您的问题的可能解决方案是，每次放置标记时都可以搜索包含现有标记的数组。

我创建了另一个存储标记的数组，稍后搜索此数组以查看其位置是否与附加事件侦听器匹配。请参阅下面的示例。

示例（未经过测试） -

var markersArray= [];
for (var i = 0; i < latlngArray.length; i++) { 
   var lat = parseFloat(latlngArray[//some index]);
   var lng = parseFloat(latlngArray[//some index]);
   var pos = new google.maps.LatLng(lat, lng); 
   marker = new google.maps.Marker({ position: pos, map: map });
   markersArray.push(marker);
   if(markersArray[i].getPosition().equals(marker.getPosition()))
   {
     addTab(markersArray[i])
   }
   else
   {
    openBubble(marker);  
   }
}  
function openBubble(currentMarker)                
{
     google.maps.event.addListener(currentMarker, 'click', function() {
       if (!infoBubble.isOpen()) {
       infoBubble.open(map, marker);
       }
     }); 
   }
}
function addTab(existingMarker)
{
     google.maps.event.addListener(existingMarker, 'click', function() {
     infoBubble.addTab(title,content);
     }); 
}

谷歌地图将标签添加到标记信息窗口

2 个答案: