1

我真的被困在这里了。如果有人可以提供帮助，将不胜感激。

我的所有代码都基于以下内容： google maps api infobox plugin and multiple markers 此代码允许您拥有多个标记，但它不会将信息框放入数组中以便稍后关闭。这就是我遇到麻烦的地方。

本质上，我只需要拥有多个标记和多个信息框，并且能够在数组中跟踪它们，这样我就可以从地图中删除它们，然后重新开始使用新的标记和信息框。该站点是一个航班跟踪器，因此标记和信息框会不断变化。我似乎无法跟踪所有信息框以进行大规模删除。我所做的一切似乎都不起作用，因为每次我进行更改都会破坏我现有的网站代码。

这是我所有受影响的代码。您会从所有注释掉的代码中看到我一直在尝试各种事情。

任何帮助表示赞赏。

newMarkers = [],
        marker;
ibArray = [];




function initialize() {
chatswood = new google.maps.LatLng(-33.945759, 151.180358);
myMapOptions = {
zoom: 9
,center: chatswood
,mapTypeId: google.maps.MapTypeId.TERRAIN
};
map = new google.maps.Map(document.getElementById("map_canvas"), myMapOptions);
}



function initMarkers(map, markerData) {
    for(var i=0; i<markerData.length; i++) {
    var iconimage = "markers/" + trackall + ".png";
    marker = new google.maps.Marker({
            map: map,
            draggable: false,
            position: markerData[i].latLng,
            visible: true,
            icon: iconimage
        });
        boxText = document.createElement("div");
        boxText.style.cssText = "border: 1px solid black; margin-top: 5px;   background:  #E0E7EF; padding: 5px;";
        boxText.innerHTML = markerData[i].address + "<br>" + markerData[i].state;
        //these are the options for all infoboxes
        infoboxOptions = {

         content: boxText
        ,disableAutoPan: true
        ,maxWidth: 0
        ,pixelOffset: new google.maps.Size(20, -75)
        ,zIndex: null
        ,boxStyle: {
          background: "url('') no-repeat"
          ,opacity: 0.75
          ,width: "140px"
         }
        ,closeBoxMargin: "10px 2px 2px 2px"
        ,closeBoxURL: ""
        ,infoBoxClearance: new google.maps.Size(1, 1)
        ,isHidden: false
        ,pane: "floatPane"
        ,enableEventPropagation: false
    };

        newMarkers.push(marker); //Adding the marker to the newMarkers Array
        newMarkers[i].infobox = new InfoBox(infoboxOptions); //Create new Infobox
        newMarkers[i].infobox.open(map, marker); //Open Infobox

        // ibArray.push({myId:ModeS,box: ib});
        //ibArray.push(marker);
        //ib[i] = new InfoBox(infoboxOptions);
        //ibArray.push({myId: ModeS,box: ib});
        //ib.open(map, marker);
        // ibArray.push({myId:ModeS,box: ib});
        //Open box when page is loaded
        //ibArray.push({myId:"ModeS",box: newMarkers});


// Add event listen, so infobox for marker is opened when user clicks
// on it.  Notice the return inside the anonymous function - this creates
// a closure, thereby saving the state of the loop variable i for the new
// marker.  If we did not return the value from the inner function,
// the variable i in the anonymous function would always refer to the last
// i used, i.e., the last infobox. This pattern (or something that
// serves the same purpose) is often needed when setting function callbacks
// inside a for-loop.

//-------------------------------------------------------------------------
// google.maps.event.addListener(marker, 'click', (function(marker, i) {
// return function() {
// newMarkers[i].infobox.open(map, this);
// map.panTo(markerData[i].latLng);
// }
// })(marker, i));
//-------------------------------------------------------------------------

}
    return newMarkers;
}

// Note: I commented out the listener event because the Infoboxes are to appear
// automatically and there won't be any user interaction on the individual
// markers. Going by the comments above though I believe I need to return
// the function but I'm not sure how if I'm not using the listener event.

// Here the call to initMarkers() is made with the necessary data for each marker.
// All markers are then returned as an array into the markers variable

markers = initMarkers(map, [
    { latLng: pointall} 

]);

boxText.innerHTML = aircrafttooltip; 

//Function to close the Infoboxes
function closeBox(id){

   for (i=0;i<ibArray.length;i++) {
     if (ibArray[i].myId==id){
         myBox = ibArray[i].box;
         myBox.close();
     }
   }
}



// Function to remove markers
function clearOverlays() {
  if (newMarkers) {
    for (var i = 0; i < newMarkers.length; i++ ) {
      newMarkers[i].setMap(null);
    }
      newMarkers.length = 0;
  }
}
4

0 回答 0