如何用jQuery隱藏谷歌地圖Api標記

你好，這可能是一個非常愚蠢的問題，但我試圖讓他們點擊時標記消失。標記位於地圖上，但當我點擊它時，它不會執行任何操作。我想知道爲什麼它不工作。謝謝！如何用jQuery隱藏谷歌地圖Api標記

<script type="text/javascript" src="jQuery.js"></script> 
    <script type="text/javascript"> 

    $(document).ready(function(){ 
     var myOptions = { 
     center: new google.maps.LatLng(40.1, -88.2), 
     zoom: 13, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

     var myLatlng = new google.maps.LatLng(40.1, -88.2); 
     var temp_marker = new google.maps.Marker({ 
      position: myLatlng, 
      map: map, 
      title:"Hello World!" 
     }); 

     console.log($(temp_marker)); 
     console.log(temp_marker); 

     //temp_marker.click(function(){$(this).hide();}); 

     $(temp_marker).click(function(){console.log("click is working"); $(this).hide();}); 
      }); 
    </script> 
</head> 
<body> 
    <div id="map_canvas" style="width:100%; height:100%"></div> 
</body>

來源

2012-03-07 wayfare

temp_marker是Javascript對象，而不是DOM元素。要監聽器連接到標記（該API將處理其DOM元素附加到如何具體），你應該使用谷歌地圖API的自己的事件系統，如：

google.maps.event.addListener(marker, 'click', function() { 
    marker.setVisible(false); // maps API hide call 
    });

他們的文檔：Google Maps Javascript API v3 - Events

來源

2012-03-07 00:42:44

這是否意味着我無法將jQuery應用於大多數Google地圖對象？ – wayfare 2012-03-07 00:50:08

@wayfare Maps API在它爲標記和實現者創建的DOM元素之間插入一層抽象。可能有技巧直接訪問DOM元素，但不支持路徑。一旦谷歌地圖進行內部更改，任何試圖直接操縱元素的嘗試都會受到破壞;它也可能不適用於跨瀏覽器。 – 2012-03-07 02:27:28

如果添加優化選項：虛假的標記聲明中，您可以通過jQuery的訪問它，但是當你移動地圖，放大或縮小，因爲這樣的API重置所有的配置，默認的，最好的方法是使用setVisible，因爲它會保持該配置。 – Corner 2015-09-04 19:54:43

是一個谷歌地圖對象，而不是DOM元素。 Jquery在DOM元素上工作。

來源

2012-03-07 00:43:02 charlietfl

我不知道，你可以只隱藏的盯防，但是Click事件相應的鉤子，將在聲明

google.maps.event.addListener(marker, 'click', function() { 
    // do your hide here 
});

做這樣的事情你可能必須刪除標記從地圖而不是「隱藏」它。

你想隱藏標記的是什麼？你必須能夠重新顯示標記嗎？你打算怎麼做到這一點？

來源

2012-03-07 00:48:11

本爲您提供了一半的答案。一旦你能夠檢測到標記點擊事件，你需要「隱藏」或從地圖上移除標記。與谷歌地圖這樣做的標準方法是做到這一點：

this.setMap(null);

然後，您可以顯示在地圖使用的setMap指定地圖對象，而不是空再次。

來源

2012-03-07 17:28:39

擴展在本手記，這應該去的地方，你已經宣佈你的標記 - 例如：

var beachMarker = new google.maps.Marker({ 
    position: myLatLng, 
    map: map, 
    icon: image 
}); 
google.maps.event.addListener(beachMarker, 'click', function() { 
    beachMarker.setVisible(false); // maps API hide call 
}); 
}

這是我花年齡試圖弄清楚這一點。巨大的功勞給本！謝謝！

來源

2014-05-23 14:10:38

如何用jQuery隱藏谷歌地圖Api標記

回答

相關問題