Центрирование пользовательских отметок на карте Google

Всем привет, У меня возникли большие проблемы с попыткой центрировать мои пользовательские метки на карте Google и увеличить их масштаб, чтобы показать их все одновременно.

Может ли кто-нибудь понять, почему это не работает!? Вот код ниже: Спасибо !!!

 
var scriptFolder = location.pathname.substr(0, location.pathname.lastIndexOf('/') + 1);
 var marker = [];
 var map;
 var lastZoom = 3;
 var lastSizeW = 40;
 var lastSizeH = 30;

 function initialize() {
 var styles = [
 {"elementType": "geometry", "stylers": [{"visibility": "no"}]}, {"elementType": "labels", "stylers": [{"visibility": "no"}]}, {"stylers": [{"color": "#ffffff"}, {"visibility": "yes"}]}, {}
 ];
 var styledMap = new google.maps.StyledMapType(styles);
 var centerlatlng = new google.maps.LatLng(0, 0);
 var myOptions = {
 zoom: 3
 , center: centerlatlng
 , styles: styles
 , panControl: true
 , zoomControl: false
 , mapTypeControl: false
 , scaleControl: false
 , streetViewControl: false
 , overviewMapControl: false
 , rotateControl: true
 , disableDefaultUI: true
 , mapTypeId: google.maps.MapTypeId.ROADMAP
 };
 map = new google.maps.Map(document.getElementById("map"), myOptions);
 var zoomControlDiv = document.createElement('div');
 var zoomControl = new ZoomControl(zoomControlDiv, map);
 var image_bar = document.getElementById("pin_image_bar");
 zoomControlDiv.index = 1;
 map.controls[google.maps.ControlPosition.RIGHT_BOTTOM].push(zoomControlDiv);
 map.controls[google.maps.ControlPosition.RIGHT_TOP].push(image_bar);
 createMarker();
 google.maps.event.addDomListener(map, 'zoom_changed', function () {
 var zoom = map.getZoom();
 if (zoom > lastZoom) {
 lastSizeW = lastSizeW + 40;
 lastSizeH = lastSizeH + 30;
 for (i in marker) {
 var image = new google.maps.MarkerImage(scriptFolder + "" + pins.Image, null, null, null, new google.maps.Size(lastSizeW, lastSizeH));
 marker.setIcon(image);
 }
 }
 else {
 if (lastSizeW != 40 && lastSizeH != 30) {
 lastSizeW = lastSizeW - 40;
 lastSizeH = lastSizeH - 30;
 }
 for (i in marker) {
 var image = new google.maps.MarkerImage(scriptFolder + "" + pins.Image, null, null, null, new google.maps.Size(lastSizeW, lastSizeH));
 marker.setIcon(image);
 }
 }
 lastZoom = zoom;
 });
 $('#map').children().closest('div').append(' <video loop="" autoplay="" poster="image_xi_logo_01.png" style="position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); min-width: 100%; min-height: 100%; width: auto; height: auto; overflow: hidden;opacity:0.7;"><source src="video_xi_bg_05a.webm" type="video/webm"> </video>');
 $('.gm-style').children().children().closest('div').addClass('pins');
 }

 function createMarker() {
 var bounds = new google.maps.LatLngBounds();
 for (i in pins) {
 var position = new google.maps.LatLng(pins.Lat, pins.Lng);
 var image = new google.maps.MarkerImage(scriptFolder + "" + pins.Image, null, /* size is determined at runtime */ null, /* origin is 0,0 */ null, /* anchor is bottom center of the scaled image */ new google.maps.Size(lastSizeW, lastSizeH));
 marker = new google.maps.Marker({
 map: map
 , title: pins.Name
 , position: position
 , icon: image
 });
 /*var content = '<div id="iw-контейнер">';
 content += '<div class="iw-title">'+pins.Info.Title+'</div>';
 content += '<div class="iw-content">';
 content += '<div class="iw-subTitle">'+pins.Info.Content.Title+'</div>';
 content += '<img src="images/'+pins.Image+'" alt="'+pins.Info.Title+'" height="115" width="83">';
 content += '<p>'+pins.Info.Content.Detail+'</p>';
 content += '</div>';
 content += '<div class="iw-bottom-gradient"></div>';
 content += '</div>';*/
 bounds.extend(marker.getPosition());
 marker.pinDetail = pins;
 google.maps.event.addListener(marker, 'click', function () {
 $("#pname").html(this.pinDetail.Name);
 var image = "<img src='" + this.pinDetail.Image + "' style='visibility:visible;'/>"
 $("#pimage").html(image);
 $("#ptitle").html(this.pinDetail.Info.Title);
 $("#pcontent").html(this.pinDetail.Info.Content);
 document.getElementById('pin_image_bar').style.display='';
 document.getElementById('overlay').style.display='';
 $('#overlay').show();
 $('#pin_image_bar').show();
 });
 }

 }
 function ZoomControl(controlDiv, map) {}

Код (разметка):

я только что ответил на свой вопрос, добавив сразу после «varbounds = new google.maps.LatLngBounds();» следующее:

 map.fitBounds(bounds); 
map.panToBounds(bounds); 

Код (разметка):