【问题标题】:Newbie Center/Set Zoom of Map to cover all visible Markers? [duplicate]新手中心/设置地图缩放以覆盖所有可见标记? [复制]
【发布时间】:2016-11-01 19:16:04
【问题描述】:

我不是 Java 程序员,但我正在使用我发现的一些代码来创建一个带有多个标记的地图,以便我可以在我的应用程序中显示它。我希望定位地图,使其位于所有标记的中心,缩小以查看所有标记。我找到了一些应该执行此操作的代码,但我不知道将其放在我拥有的代码中的哪个位置。我也有点不确定我拥有的代码是否良好且高效。非常感激任何的帮助。我认为我需要的代码是

var markers = [];//some array
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < markers.length; i++) {
  bounds.extend(markers[i].getPosition());
}

map.fitBounds(bounds);

我的代码是.....

var locations = [
['C1',-36.8604268000000,174.8360801000000,13140,'521 3131','E','Keith','','',6.72],
['C2',-36.9127356000000,174.9177729000000,16638,'535 5710','E','Debra','d@xtra.co.nz','027 1234546',15.59],
['C3',-36.9045042000000,174.8237394000000,28477,'725 5566','E','Yolande','y@a.kiwi.nz','027 1234546',8.31],
['C4',-36.8945087000000,174.8511699000000,25075,'70 5055','E','Vanessa','accounts@b.co.nz','027 1234546',9.44],
['C5',-36.9045042000000,174.8237394000000,25854,'25 5566','E','Yolande','z@f.kiwi.nz','027 1234546',8.31],
['C6',-36.8845042000000,174.8499481000000,21292,'7 3056','E','Paul','p@xtra.co.nz','027 1234546',8.79],
['C7',-36.8927054000000,174.8331774000000,30664,'06695791777','Not Rated','Jackie','admin@xyz.kiwi','027 1234546',8.01],
['C8',-36.9046501000000,174.8236843000000,25146,'789 525 3123','E','Debra','','02027 1234546',8.31],
['C9',-36.9338100000000,174.8967737000000,23342,'9274 4620','E','Janneane','j@adn.co.nz','',15.29],
['C10',-36.9222589000000,174.8529857000000,21336,'333 0793','E','Cynthia','cynthia@vt.co.nz','027 123 935',11.53],
['Test Client',-36.8484597000000,174.7633315000000,13983,'0652988421','E','Mickey Mouse','r@xyz.com','',0.10],
['Test Client 9 ACC',-36.8484597000000,174.7633315000000,27264,'8956398842','E','Matt','kn@ec.com','021 288 9999311',0.10],
['Test Client 6',-36.9316457000000,174.5736167000000,23605,'33 814 9577','E','John','ward@xtra.co.nz','027893068',19.17],
['Test Client 7',-36.8658161000000,174.5801917000000,22566,'44 232 0082','E','Yolanda','sw@stu.co.nz','02374585',16.33],

];

function initialize() {

var myOptions = {
center: new google.maps.LatLng(-36.8484480000000,174.7621910000000),
  zoom: 15,
  mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("default"),
    myOptions);

setMarkers(map,locations)

}

function setMarkers(map,locations){

   var marker, i

for (i = 0; i < locations.length; i++)
{

var name = locations[i][0]
var lat = locations[i][1]
var long = locations[i][2]
var code =  locations[i][3]
var phone =  locations[i][4]
var rating =  locations[i][5]
var contact =  locations[i][6]
var contactemail =  locations[i][7]
var contactmobile =  locations[i][8]
var Kms =  locations[i][9]

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

var marker = new google.maps.Marker({
       map: map, title: name , position: latlngset
     });
     map.setCenter(marker.getPosition())

      var content = "Client: " + name + '</p>' + '</h3>' + "Client No: " + code + '</p>' +  '</h3>' + "Telephone: " + phone + '</p>' +  '</h3>' + "Rating: " + rating + '</p>' +  '</h3>' + "Contact Name: " +  contact + '</p>' +  '</h3>' + "Contact Email: " + contactemail + '</p>' +  '</h3>' + "Contact Mobile: " + contactmobile + '</p>' +  '</h3>' + "Kms From Start Point: " + Kms

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));
}
}
}

【问题讨论】:

    标签: javascript google-maps


    【解决方案1】:

    var markers = []; //some array
    var locations = [
      ['C1', -36.8604268000000, 174.8360801000000, 13140, '521 3131', 'E', 'Keith', '', '', 6.72],
      ['C2', -36.9127356000000, 174.9177729000000, 16638, '535 5710', 'E', 'Debra', 'd@xtra.co.nz', '027 1234546', 15.59],
      ['C3', -36.9045042000000, 174.8237394000000, 28477, '725 5566', 'E', 'Yolande', 'y@a.kiwi.nz', '027 1234546', 8.31],
      ['C4', -36.8945087000000, 174.8511699000000, 25075, '70 5055', 'E', 'Vanessa', 'accounts@b.co.nz', '027 1234546', 9.44],
      ['C5', -36.9045042000000, 174.8237394000000, 25854, '25 5566', 'E', 'Yolande', 'z@f.kiwi.nz', '027 1234546', 8.31],
      ['C6', -36.8845042000000, 174.8499481000000, 21292, '7 3056', 'E', 'Paul', 'p@xtra.co.nz', '027 1234546', 8.79],
      ['C7', -36.8927054000000, 174.8331774000000, 30664, '06695791777', 'Not Rated', 'Jackie', 'admin@xyz.kiwi', '027 1234546', 8.01],
      ['C8', -36.9046501000000, 174.8236843000000, 25146, '789 525 3123', 'E', 'Debra', '', '02027 1234546', 8.31],
      ['C9', -36.9338100000000, 174.8967737000000, 23342, '9274 4620', 'E', 'Janneane', 'j@adn.co.nz', '', 15.29],
      ['C10', -36.9222589000000, 174.8529857000000, 21336, '333 0793', 'E', 'Cynthia', 'cynthia@vt.co.nz', '027 123 935', 11.53],
      ['Test Client', -36.8484597000000, 174.7633315000000, 13983, '0652988421', 'E', 'Mickey Mouse', 'r@xyz.com', '', 0.10],
      ['Test Client 9 ACC', -36.8484597000000, 174.7633315000000, 27264, '8956398842', 'E', 'Matt', 'kn@ec.com', '021 288 9999311', 0.10],
      ['Test Client 6', -36.9316457000000, 174.5736167000000, 23605, '33 814 9577', 'E', 'John', 'ward@xtra.co.nz', '027893068', 19.17],
      ['Test Client 7', -36.8658161000000, 174.5801917000000, 22566, '44 232 0082', 'E', 'Yolanda', 'sw@stu.co.nz', '02374585', 16.33],
    
    ];
    
    function initialize() {
    
      var myOptions = {
        center: new google.maps.LatLng(-36.8484480000000, 174.7621910000000),
        zoom: 15,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      };
      var map = new google.maps.Map(document.getElementById("default"),
        myOptions);
    
      setMarkers(map, locations)
    }
    
    function setMarkers(map, locations) {
      var bounds = new google.maps.LatLngBounds();
      var marker, i
    
      for (i = 0; i < locations.length; i++) {
    
        var name = locations[i][0]
        var lat = locations[i][1]
        var long = locations[i][2]
        var code = locations[i][3]
        var phone = locations[i][4]
        var rating = locations[i][5]
        var contact = locations[i][6]
        var contactemail = locations[i][7]
        var contactmobile = locations[i][8]
        var Kms = locations[i][9]
    
        latlngset = new google.maps.LatLng(lat, long);
    
        var marker = new google.maps.Marker({
          map: map,
          title: name,
          position: latlngset
        });
        map.setCenter(marker.getPosition())
    
        var content = "Client: " + name + '</p>' + '</h3>' + "Client No: " + code + '</p>' + '</h3>' + "Telephone: " + phone + '</p>' + '</h3>' + "Rating: " + rating + '</p>' + '</h3>' + "Contact Name: " + contact + '</p>' + '</h3>' + "Contact Email: " + contactemail + '</p>' + '</h3>' + "Contact Mobile: " + contactmobile + '</p>' + '</h3>' + "Kms From Start Point: " + Kms
    
        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));
        bounds.extend(marker.getPosition());
      }
      map.fitBounds(bounds);
    }
    google.maps.event.addDomListener(window, 'load', initialize);
    html,
    body,
    #default {
      height: 100%;
      width: 100%;
      margin: 0px;
      padding: 0px
    }
    <script src="https://maps.googleapis.com/maps/api/js?"></script>
    <div id="default"></div>

    【讨论】:

      猜你喜欢
      • 2013-10-18
      • 2015-12-27
      • 2016-04-26
      • 2015-09-23
      • 2020-09-04
      • 2019-05-25
      • 1970-01-01
      • 2012-12-13
      • 1970-01-01
      相关资源
      最近更新 更多