google map 多 marker 自动调整 zoom 显示

google-map.js

// 获取当前列表 经纬度
var latlngMarkerArray = <%= raw @lat_lng.to_json %>;

var markers = [];
var mapOptions = {
  zoom: 10,
}
if(latlngMarkerArray.length > 0){
  mapOptions['center'] = latlngMarkerArray[0]
}

var map = new google.maps.Map(document.getElementById('pois_map'), mapOptions);

drop();

function drop() {
  clearMarkers();
  var bounds = new google.maps.LatLngBounds();
  for (var i = 0; i < latlngMarkerArray.length; i++) {
    var marker = new google.maps.Marker({
      position: latlngMarkerArray[i],
      map: map
    });
    markers.push(marker);
    bounds.extend(marker.position);
  }
  map.setCenter(bounds.getCenter());
  map.fitBounds(bounds);
}

function clearMarkers() {
  for (var i = 0; i < markers.length; i++) {
    markers[i].setMap(null);
  }
  markers = [];
}