谷歌地圖API - 點擊事件不起作用，Mouseover呢？

首先在這裏發帖，通常是讀者而不是海報，但這裏去！谷歌地圖API - 點擊事件不起作用，Mouseover呢？

使用Google Maps API「點擊」事件有點麻煩。

這裏是場景：
標記被放置在地圖上，點擊事件添加到標記，工作正常。另一個標記直接添加到現有標記頂部的地圖上，沒有點擊事件。原始標記的點擊事件現在不再有效！但是，如果我將'click'事件更改爲'mouseover'，則可以正常工作。

代碼的第一個標記：

var marker1 = new google.maps.Marker({ 
     position: marker1[0], 
     map: map, 
     draggable: false, 
     icon: new google.maps.MarkerImage('img/' + type + '.png',   
     new google.maps.Size(16, 16), 
     new google.maps.Point(0,0), 
     new google.maps.Point(8, 8) 
     ) 
    });

代碼標記是大幹快上已有標記重疊：

var marker2 = new google.maps.Marker({ 
      position: position, 
      map: map, 
      icon: { 
      path: google.maps.SymbolPath.CIRCLE, 
      fillOpacity: 0, 
      strokeOpacity: 1.0, 
      strokeColor: '#72008F', 
      strokeWeight: 3.0, 
      scale: 10 
      } 
     });

代碼監聽器：

google.maps.event.addListener(marker, 'click', function(event) { 
    $("#IDhere").html("Some HTML here"); 
});

來源

2014-01-07 OliverDeLange

爲什麼你會希望能夠點擊標記物隱藏？如果您將點擊偵聽器添加到新標記，我預計它會起作用。 – geocodezip

它可能會工作，但有很多標記可以覆蓋頂部，這將意味着成千上萬的事件處理程序的變體。我感興趣的是，爲什麼鼠標懸停事件工作正常，點擊沒有？此外，我試圖添加標記我想最後點擊，希望它會在其他標記頂部，但是這並不奏效。 – OliverDeLange

對於鼠標懸停的情況，代碼的外觀如何？（一個jsfiddle也許？）代碼是什麼樣的，你把可點擊標記放在哪裏？你是否設置了標記的zIndex？ – geocodezip

我的方式解決我的問題的解決方法。

我看到的問題是，使用「new google.maps.MarkerImage」定義「可點擊」標記使其成爲Google Maps canvas元素的一部分。

然後，當使用「google.maps.SymbolPath.CIRCLE」定義的標記出現並置於可點擊標記的頂部時，它們是單獨的元素，侷限於地圖Canvas元素頂層的Div中。

因此作爲@geocodezip正確指出，可點擊標記（谷歌地圖畫布的一部分）被其他Div標記隱藏。

我的解決方案是改變我創建可點擊標記的方式。我用另一個圓形符號路徑，並給它一個99999的zIndex，所以總是在最上面。

光標1現在看起來是這樣

var marker = new google.maps.Marker({ 
     position: marker1[0], 
     map: map, 
     draggable: false, 
     zIndex: 99999, 
     icon: { 
      path: google.maps.SymbolPath.CIRCLE, 
      fillOpacity: 1, 
      fillColor: type, 
      strokeOpacity: 1, 
      strokeColor: '#000', 
      strokeWeight: 1 , 
      scale: 5 
      }   
    });

來源

2014-01-08 12:32:13 OliverDeLange

谷歌地圖API - 點擊事件不起作用，Mouseover呢？

回答

相關問題