Как добавить несколько маркеров в Gmap3?

Вы должны использовать asp: LinkButton вместо app: Button, вот как это работает для меня, используя Bootstrap 3 в веб-приложении ASP.NET:

Из вашего кода вы можете выполнить следующую работу:


    

Вот пример того, что я использую для кнопки Submit с текстом «Отправить»:


    Submit

0
задан Nilesh Pandit 16 January 2019 в 07:59
поделиться

3 ответа

Вы можете передать маркерный список:

var markers = [
    { lat: 37.772, lng: -122.214 },
    { lat: 21.291, lng: -157.821 },
    { lat: -18.142, lng: 178.431 },
    { lat: -27.467, lng: 153.027 }
    ];

    function markerSetup(markers){

      var mapOptions = {
                    center: new google.maps.LatLng(markers[0].lat, markers[0].lng),
                    zoom: 10,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };

                var icon = {
                    url: "../Content/Images/Car.png", // url
                    scaledSize: new google.maps.Size(50, 60), // scaled size
                    origin: new google.maps.Point(0, 0), // origin
                    anchor: new google.maps.Point(0, 0) // anchor
                };

                // alert(markers[0].lat)
                var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);


                var trafficLayer = new google.maps.TrafficLayer();
                trafficLayer.setMap(map);
                // map.setMap(trafficLayer);

                var infoWindow = new google.maps.InfoWindow();
                var lat_lng = new Array();
                var latlngbounds = new google.maps.LatLngBounds();
                for (i = 0; i < markers.length; i++) {
                    var data = markers[i]
                    var myLatlng = new google.maps.LatLng(data.lat, data.lng);
                    lat_lng.push(myLatlng);
                    var marker = new google.maps.Marker({
                        position: myLatlng,
                        icon: icon,
                        map: map,
                        title: data.title
                    });
                    latlngbounds.extend(marker.position);
                    (function (marker, data) {
                        google.maps.event.addListener(marker, "click", function (e) {
                            infoWindow.setContent(data.description);
                            infoWindow.open(map, marker);
                        });
                    })(marker, data);
                }
                map.setCenter(latlngbounds.getCenter());
                map.fitBounds(latlngbounds);
                map.setZoom(12)

            });
    }

Это работоспособный код. Надеюсь, это поможет вам. enter image description here

0
ответ дан Majedur Rahaman 16 January 2019 в 07:59
поделиться

Итак, в конце концов я нашел Правильное решение для себя, так что спасибо за поддержку

var locations = [
  ['Yanbu Saudi Arabia', 24.091328, 38.037067, 1],
  ['Yanbu Saudi Arabia', 24.005421, 38.197395, 2]
];

var map = new google.maps.Map(document.getElementById('tm-map'), {
  zoom: 10,
  center: new google.maps.LatLng(24.005421, 38.197395),
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var infowindow = new google.maps.InfoWindow();

var marker, i;
var markers = [];

for (i = 0; i < locations.length; i++) {  
  marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),
    map: map
  });

  markers.push(marker);

  google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.setContent(locations[i][0]);
      infowindow.open(map, marker);
    }
  })(marker, i));
}

console.log(markers[0]);
0
ответ дан Nilesh Pandit 16 January 2019 в 07:59
поделиться
Другие вопросы по тегам:

Похожие вопросы: