@polo777

Как изменить картинку определённого маркера в гугл мапс?

Ребята, есть код, помогите определённому маркеру поставить свой маркер, спасибо всем кто поможет
<!DOCTYPE html>
<html>
  <head>
    <title>Custom Markers</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
      <style>
body{
  margin:0;
}
#map{
  width: 100%;
  height:400px;
}
    </style>
  
  </head>
  <body>
<div id="map"></div>

<script src="https://maps.google.com/maps/api/js?key=AIzaSyAA58o0KC7WSYt0SL9MdIpG5TgyszMHZgw&callback"></script>
 <script>
 google.maps.event.addDomListener(window, 'load', init);
    var locations = [
        ['Rīga', 50.31911, 30.29728, 'Salnas iela 1a'],
		['Tukums', 50.233871, 30.293275, 'Raudas iela 30a'],
        ['Tukums', 50.333871, 30.283275, 'Raudas iela 30a']
	
    ];

    function init() {

        var myOptions = {
            center: new google.maps.LatLng(50.322779, 30.301986),
            zoom: 14,
            mapTypeId: google.maps.MapTypeId.ROADMAP

        };
        var map = new google.maps.Map(document.getElementById("map"),
            myOptions);

        setMarkers(map, locations)
    }


    function setMarkers(map, locations) {

        var marker, i, mark_position;
        for (i = 0; i < locations.length; i++) {

            var title = locations[i][0];
            var lat = locations[i][1];
            var long = locations[i][2];
            var text = locations[i][3];

            mark_position = new google.maps.LatLng(lat, long);

             marker = new google.maps.Marker({
                 map: map,
                 title: title,
                 position: mark_position,
                 animation: google.maps.Animation.DROP,
                 icon: ''
            });

            var content = '<div class="info-block"><h3>' + title + '</h3><b>' + "Address: </b>" + text + '</div>';
            var infowindow = new google.maps.InfoWindow();

            google.maps.event.addListener(marker,'click', (function(marker,content,infowindow){
                return function() {
                    infowindow.setContent(content);
                    infowindow.open(map,marker);
                };
            })(marker,content,infowindow));
        }
    }
	  </script>

  </body>
</html>
  • Вопрос задан
  • 41 просмотр
Пригласить эксперта
Ответы на вопрос 1
@Che603000
c 2011 javascript
// моя иконка
const image = {
    url: 'https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png',
    // This marker is 20 pixels wide by 32 pixels high.
    size: new google.maps.Size(20, 32),
    // The origin for this image is (0, 0).
    origin: new google.maps.Point(0, 0),
    // The anchor for this image is the base of the flagpole at (0, 32).
    anchor: new google.maps.Point(0, 32)
  };

marker = new google.maps.Marker({
                 map: map,
                 title: title,
                 position: mark_position,
                 animation: google.maps.Animation.DROP,
                 icon:  image   // ставим свою иконку
            });


дос https://developers.google.com/maps/documentation/j...
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы