2

インフォボックス（グーグルマップ）でcloseclickイベントを適用する方法を探すのにうんざりしています。考えられるほとんどすべてのシナリオを試しましたが、成功しませんでした。私を助けてください

これはマーカーを追加する私のコードです：-

var ib_click = new InfoBox();
ib_click.isOpen = false;
var toShowHover = true;

function add_marker(lat,lng,icn,title,box_html) {
  var mapcode,myOptions;
  var marker = new google.maps.Marker({
    /*marker settings*/
  });   


  myOptions = {
    /*option of infobox*/
  };
  marker.ibOptions = myOptions;
  google.maps.event.addListener(marker, 'click', function() {
    mapcode = /* html for showing box */
    myOptions.content = mapcode;
    myOptions.boxStyle.width = "235px";
    ib_click.setOptions(marker.ibOptions);
    ib_click.open(map, marker);
    ib_click.isOpen = true;

    toShowHover = false;
  });   
  google.maps.event.addListener(marker, 'mouseover', function() {
    //this is fired
    var mapcode = /*html for showing hover*/;
    //ib_click.open(map, marker);
    myOptions.content = mapcode;
    myOptions.boxStyle.width = "205px";
    ib_click.setOptions(marker.ibOptions);
    ib_click.open(map, marker);
    // ib_click.isOpen = true;
  });   
  google.maps.event.addListener(marker, 'mouseout', function() {
    //alert('mouse out');//this is fired
    //toShowHover = true;
  });

  google.maps.event.addListener(ib_click, 'closeclick', function(){
    //how to use closeclick 
    //showing error here
    alert('closed');
  });
  return marker;
}

少し光を当ててください、Ankurに感謝します;（

4

1 に答える 1

3

ボックスが開かれた直後、})の前に閉じるクリックのリスナーを追加してみてください。鬼ごっこ。ボックスの作成時に、ボックスごとにリスナーを含める必要があります。

以下は、閉じるクリックリスナーを使用した私のコードです。

function addMarker(location) {
var marker = new google.maps.Marker({
position: location,
map: map,
icon: "/mapping/redmarker1.png",
title:markerClickGrid
});
markers.push(marker);
    var boxText = document.createElement("div");
    boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: gray; padding: 5px; color:white;";
    boxText.innerHTML = marker.title;
    var myOptions = {
     content: boxText
    ,disableAutoPan: false
    ,maxWidth: 0
    ,pixelOffset: new google.maps.Size(10, -50)
    ,zIndex: null
    ,boxStyle: { 
    background: "url('tipbox.gif') no-repeat"
    ,opacity: 0.75
    ,width: "140px"
    }
    ,closeBoxMargin: "10px 2px 2px 2px"
    ,closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif"
    ,infoBoxClearance: new google.maps.Size(1, 1)
    ,isHidden: false
    ,pane: "floatPane"
    ,enableEventPropagation: false
    };
    var ib = new InfoBox(myOptions);
    ib.open(map,marker);
    preventmarkermouseoutibclose = true;

google.maps.event.addListener(ib, 'closeclick', function(event) {
    preventmarkermouseoutibclose = false;
    document.getElementById('debugtext').value = "ib close click detected";
});
google.maps.event.addListener(marker, 'click', function() {
    ib.open(map,marker);
    preventmarkermouseoutibclose = true;
    document.getElementById('debugtext').value = "ib open detected";
});
google.maps.event.addListener(marker, 'rightclick', function(event) {
    ib.close(map,marker);
    marker.setMap(null);
    preventmarkermouseoutibclose = false;
    document.getElementById('debugtext').value = "ib close on rightclick detected";
});
google.maps.event.addListener(marker, "mouseover", function() {
    document.getElementById('debugtext').value = "marker mouseover detected";
    ib.open(map,marker);
});
google.maps.event.addListener(marker, "mouseout", function() {
    if(preventmarkermouseoutibclose==true){
    }
    else if(preventmarkermouseoutibclose==false){
    ib.close(map,marker);
    }
});

ib は私の情報ボックスの名前です。インフォボックス ib が開かれるたびに、"closeclick" を探すリスナーが追加されます。

これは私にとってはうまくいきます。それがうまくいくことを願っています。

于 2014-07-24T22:42:41.760 に答える