googlearchive/js-marker-clusterer

How can I make the individual markers clickable as well.

Markj89 opened this issue · 1 comments

I'm using this tool for JSON data being pulled from my company's API.
I was able to use the markerCluster, however it does make the single markers clickable any more.

Has anyone else ran into this problem before

function initMap() {
        var map = null;
	var markers = [];
	var infoWindow = null;
	var json = $scope.response;
	var markerClusterer = null;
	var imageUrl = null;
	$.each(json, function(key, val) {
		var center = new google.maps.LatLng(val.lat, val.lng);
		var options = {
			"center": center,
			"zoom": 3,
			"mapTypeId": google.maps.MapTypeId.ROADMAP,
			"sensor": false
		};
		var map = new google.maps.Map(document.getElementById("map"), options);
		var infoWindow = new google.maps.InfoWindow();

		// Looping through the JSON data
		for (var i = 0, length = json.length; i < length; i++) {
			var data = json[i],
			latLng = new google.maps.LatLng(data.lat, data.lng);


			var imageUrl = 'http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=' + 'FFFFFF,008CFF,000000&ext=.png';
			var markerImage = new google.maps.MarkerImage(imageUrl, new google.maps.Size(24, 32));
			var marker = new google.maps.Marker({
				"position": latLng,
				"icon": markerImage
			});
			markers.push(marker);

			(function(markers, data) {
				google.maps.event.addListener(markers, "click", function() {
					infoWindow.setContent(data.description);
					infoWindow.setPosition(latLng);
				        infoWindow.open(map, markers);
				});
			})(markers, data);
		}
		var markerCluster = new MarkerClusterer(map, markers, {
		imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'
		});
	});
}
initMap();

I solved this issue.