在谷歌地圖中使用單選按鈕切換標記

我有4個城市在洛杉磯，我有5個單選按鈕，如果我想點擊每個標記，它會顯示或隱藏特定標記或顯示所有標記，我該如何實現？在谷歌地圖中使用單選按鈕切換標記

下面的代碼

var map; 
    function initMap() { 
    map = new google.maps.Map(document.getElementById('map'), { 
     center: {lat: 34.052235, lng: -118.243683}, 
     zoom: 11 
    }); 
    setMarkers(map); 
    } 

    var cities = [ 
     ['Compton Los Angeles', 33.895847, -118.220070], 
     ['Huntington Los Angeles', 33.984932, -118.227821], 
     ['Los Angeles International Airport',33.942791, -118.410042], 
     ['Beverly Hills Los Angeles',34.073620, -118.400352] 
    ]; 

    function setMarkers(map) { 
     for (var i = 0; i < cities.length; i++) { 
      var city = cities[i]; 
      var marker = new google.maps.Marker({ 
       position: {lat: city[1], lng: city[2]}, 
       map: map 
      }); 
     } 
    } 

<input id="compton" type="radio" name="city" checked="checked"> 
<input id="huntington" type="radio" name="city"> 
<input id="losangeles" type="radio" name="city"> 
<input id="beverlyhills" type="radio" name="city"> 
<input id="showall" type="radio" name="city">

來源

2017-08-08 Jemai

  google.maps.event.addListener(marker, 'click', function() { 
       // Show\hide radio-btns 
       document.getElementById("showall").style.display = 'none'; 
       document.getElementById("compton").style.display = 'inline'; 
       // Hide marker 
       this.setVisible(false); // maps API hide call 
       // or 
       markers[2].setVisible(false); 
      });

的jsfiddle：http://jsfiddle.net/4a87k/857/（更新）

這是怎麼上的標記添加onclick事件：adding-an-onclick-event-to-google-map-marker

來源

2017-08-08 07:54:45 Constantine

的標記會隱藏，如果你點擊標記，我的意思是如果你單擊單選按鈕它將顯示特定的標記。 – Jemai

@Jemai你應該寫更好的問題））好的。我重寫了JsFiddle中的代碼[這裏]（http://jsfiddle.net/4a87k/857/） – Constantine

耶哈哈！無論如何，它的作品感謝兄弟！ – Jemai

在谷歌地圖中使用單選按鈕切換標記

回答

相關問題