谷歌地图标记群集不工作，但没有错误

Question

这是我第一次使用GoogleMaps / JS。 我的地图按预期工作，带有单个标记。但是当我添加标记集群功能时，它不起作用，最好的部分是控制台上没有错误。

以下是我的代码。任何帮助将不胜感激。

＆＃13;

＆＃13;

function CreateMap(rootElement,data,startPin,endPin){
	//console.log("startPin : " + startPin);
	var google = window.google;
	var map;
	var marker;
	var posInfoWindow;
	var markers = [];
	var markersArray = [];
	var mapElement = rootElement.querySelector('.my-map');
	currPos = localStorage.currentPosition;
	var currentPosition = JSON.parse(localStorage.currentPosition);
	var results = JSON.parse(data); 
	
	var defaultIcon, selectedIcon, mainIcon;

        function centerOnMyLocation() {
            closeAllInfoWindows();
            map.panTo(marker.getPosition());
            posInfoWindow.open(map, marker);
        }

        function closeAllInfoWindows() {
            if(posInfoWindow !== void 0) {
                posInfoWindow.close();
            }

            markers.forEach(function(it) {
                it.infoWindow.close();
                it.marker.setIcon(defaultIcon);
            });
        }

        function showInfoWindow(idx) {
            closeAllInfoWindows();
            if(map !== void 0) {
                markers[idx].infoWindow.open(map, markers[idx].marker);
                markers[idx].marker.setIcon(selectedIcon);
            }
        }

        function highlightListItem(idx) {
            var items = rootElement.querySelectorAll('.my-result-list-item');

            [].forEach.call(items, function(it) {
                it.className = it.className.replace('my-result-list-item-highlight', '');
            });

            items[idx].className += ' my-result-list-item-highlight';
        }

        function selectMarker(idx) {
            showInfoWindow(idx);
            highlightListItem(idx);
        }
		
		defaultIcon = {
            url: "/maps/Locator_Green_Pin.png",
            anchor: new google.maps.Point(0, 0),
            labelOrigin: new google.maps.Point(34, 35)
        };

        selectedIcon = {
            url: "/maps/Locator_Yellow_Pin.png",
            anchor: new google.maps.Point(0, 0),
            labelOrigin: new google.maps.Point(34, 35)
        };

        mainIcon = {
            url: "/maps/Locator_Blue_Pin.png",
            anchor: new google.maps.Point(0, 0)
        };
		
		var myLatlng = new google.maps.LatLng(currentPosition.latitude, currentPosition.longitude);
        map = new google.maps.Map(mapElement, {
            center: myLatlng,
            zoom: 3,
            styles: [
                {
                    featureType: 'poi',
                    stylers: [{ visibility: 'off' }]  // Turn off points of interest.
                }, {
                    featureType: 'transit.station',
                    stylers: [{ visibility: 'off' }]  // Turn off bus stations, train stations, etc.
                }
            ],
			'mapTypeId': google.maps.MapTypeId.ROADMAP,
            disableDoubleClickZoom: false,
            scaleControl: true
        });

        map.addListener('click', function() {
            closeAllInfoWindows();
        });
		
		bounds  = new google.maps.LatLngBounds(); // MapAutoZoom : to fit the  markers on the map
		
		//alert("working on map");
		//results.forEach(function(it, idx) {
		$.each(results, function(idx, it) {
			
			//console.log("it : " + it + " , idx : "+idx);
            var labelXoffset = -30;
            var labelYOffset = -28; //reduce x offset to center longer labels 
         
			
            if (idx >= 9 && idx <= 98) {
                labelXoffset = -27;
            }
            else if ( idx >= 99 && idx <= 998 ) {
                labelXoffset = -24;
            }
			
			if(startPin<= idx && idx<= endPin){
				var m = new MarkerWithLabel({
					position: new google.maps.LatLng(it.Latitude, it.Longitude),
					title: it.MerchantName,
					animation: google.maps.Animation.DROP,
					draggable: false,
					map: map,
					labelContent: (idx+1).toString(),
					labelAnchor: new google.maps.Point(labelXoffset, labelYOffset),
					icon: defaultIcon
				});
			
				m.addListener('click', function() {
					if (idx !== -1) {
						showInfoWindow(idx);
						highlightListItem(idx);
					}
				});
				var iw = new google.maps.InfoWindow({
					content: "<div class='my-info-window'>View details</div>"
				});
				var obj = {
					marker: m,
					infoWindow: iw
				};
				markers.push(obj);
				 var latlongVal = new google.maps.LatLng(data[i].latitude, data[i].longitude);
				  var markerVal = new google.maps.Marker({
						position: latlongVal						
					  });
						   
				markersArray.push(markerVal);				
				bounds.extend(m.position);//MapAutoZoom
			}
			if(idx== endPin)
				return false;
		});
		console.log(markersArray);
		map.fitBounds(bounds);       // MapAutoZoom : auto-zoom
		map.panToBounds(bounds);    // MapAutoZoom : auto-center
		marker = new google.maps.Marker({
            position: myLatlng,
            title: "Me",
            animation: google.maps.Animation.DROP,
            icon: mainIcon
        });

        marker.setMap(map);

        posInfoWindow = new google.maps.InfoWindow({
            content: "My current location"
        });

        marker.addListener('click', function() {
            showInfoWindow(posInfoWindow, marker, map);
        });
		//
        // Custom Current Position Control
        //

        var centerControlDiv = document.createElement('div');

        var div = document.createElement('div');
        div.id = 'goToMeUI';
        div.className = 'my-map-current-position-control-container';
        div.title = 'Click to show your current position';
        centerControlDiv.appendChild(div);
        centerControlDiv.index = 1;

        var img = document.createElement('img');
        img.src = '/maps/Locator_Blue_Pin.svg';
        div.appendChild(img);

        div.addEventListener('click', centerOnMyLocation);

        map.controls[google.maps.ControlPosition.RIGHT_BOTTOM].push(centerControlDiv);

        //
        // List item click event handling
        //
        $( '.my-result-list-item', rootElement ).on('click', function(event) {
			//alert("map result clicked");
            selectMarker(event.currentTarget.getAttribute('data-map-list-index'));
        });
		
		function initialize(){
			var markerCluster = new MarkerClusterer(map, markersArray, {imagePath: '/maps/cluster/m'});      
		}
		
     google.maps.event.addDomListener(window, 'load', initialize);
		
}

＆＃13;

＆＃13;

＆＃13;