Переключить Показать / Скрыть Маркер Google с 1 кнопкой - PullRequest
0 голосов
/ 31 мая 2018

Я пытаюсь переключить кнопку, которая будет скрывать / показывать маркер Google, размещенный на карте.Я искал ответ на SOF, но все предложили метод массива.Мне интересно, если это можно сделать без массива.

      function initMap() {
    map = new google.maps.Map(document.getElementById('map'), {
      zoom: 12,
      center: {lat: 1.3420894594991328, lng: 103.83490918886719},
    });

        var ntuc = {
        lat: 1.32805676,
        lng: 103.9216584
    };

        var ntucmap = new google.maps.Marker({
        position: ntuc,
        map: map,
        icon: 'https://maps.google.com/mapfiles/kml/paddle/blu-stars.png'
    });

   }

      function toggleNTUCmap() {
    if (!ntucmap.getVisible()) {
        ntucmap.setVisible(true);
    } else {
        ntucmap.setVisible(false);
    }
  }

Кнопка

<button class="button-oj pure-button" onclick="toggleNTUCmap()">
          <i class="fas fa-hospital"></i> NTUC</button>

Для функции toggleNTUCmap (), я пробовал следующее, которое по-прежнему не будет работать.

ntucmap.setMap(ntucmap.getMap() ? null : map);

Ответы [ 2 ]

0 голосов
/ 04 июня 2018
// Adds a marker at the center of the map.
var ntuc = {lat: 1.32805676, lng: 103.9216584};
addMarker(ntuc);
setMapOnAll(null);

// Adds a marker to the map and push to the array.
function addMarker(location) {
    var marker = new google.maps.Marker({
        position: location,
        map: map,
        icon: 'https://maps.google.com/mapfiles/kml/paddle/blu-stars.png'
    });
    markers.push(marker);
}

// Sets the map on all markers in the array.
function setMapOnAll(map) {
    for (var i = 0; i < markers.length; i++) {
        markers[i].setMap(map);
    }
}

// Show/Hide Markers
var counter = 0;

function toggleMarkers() {
    if (counter == 0) {
        setMapOnAll(map);
        counter = 1;
    } else {
        setMapOnAll(null);
        counter = 0;
    }
}

В итоге я использовал массив для сохранения всех маркеров.На основе кнопки, которую пользователь использовал для переключения, он будет определять, будут ли отображаться на карте маркер (ы).

0 голосов
/ 31 мая 2018

Разве вы не можете сделать что-то подобное?

    function clearMap(map) {
    for(var i = 0; i<ntucmap.length; i++){
      ntucmap[i].setMap(null);
    }
  }

и для части шоу

function setMapOnAll(map) {
    for (var i = 0; i < ntucmap.length; i++) {
      ntucmap[i].setMap(map);
    }
}

Тогда, чтобы иметь это в одной кнопке, вы можете сохранить счетчик с помощью своей кнопкии когда он выполняет одну функцию, а другой - другую?

...