Как менять изображение маркера по клику на него?

Question

[avshivtseva]

Как можно менять изображение маркера на карте при клике на него?

Answer 1

[0xD34F]

<div class="map" id="map"></div>
<script src="https://maps.googleapis.com/maps/api/js"></script>

html, body {
  padding: 0;
  margin: 0;
}

.map {
  position: absolute;
  width: 100%;
  height: 100%;
}

let iconIndex = -1;
const icons = [
  'http://icons.iconarchive.com/icons/icons-land/vista-map-markers/64/Map-Marker-Marker-Outside-Chartreuse-icon.png',
  'http://icons.iconarchive.com/icons/icons-land/vista-map-markers/64/Map-Marker-Marker-Outside-Azure-icon.png',
  'http://icons.iconarchive.com/icons/icons-land/vista-map-markers/64/Map-Marker-Marker-Outside-Pink-icon.png'
];

google.maps.event.addDomListener(window, 'load', function() {
  const latlng = { lat: -25.363, lng: 131.044 };

  const map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: latlng,
  });

  const marker = new google.maps.Marker({
    position: latlng,
    map,
  });

  google.maps.event.addListener(marker, 'click', function() {
    iconIndex = (iconIndex + 1) % icons.length;
    marker.setIcon(icons[iconIndex]);
  });
});

Comments

[avshivtseva]

Спасибо!!!