I am trying to create a google map with selected locations grouped into clusters, I download locations from the database via php/Ajax. Everything works great, markers add’s up, but clusters don’t. I must have missed something … any help, sugestions?
my js code belowe
//code
let map;
let locations=[];
var nowa = [];
function initMap() {
map = new google.maps.Map(document.getElementById("map"), {
mapId: '57981e8fa66decba',
center: { lat: 54.372158, lng: 18.638306 },
zoom: 12,
streetViewControl: false,
fullscreenControl: false,
mapTypeControl: false,
});
const infoWindow = new google.maps.InfoWindow({
content: "",
disableAutoPan: true,
});
laduj();
function laduj(){
var xhr = new XMLHttpRequest();
xhr.open('GET', 'coordinates.php?q=', true);
xhr.send(); //wysyła zapytanie
xhr.onload = function(){ //co ma zrobić po otrzymaniu danych
var dane = this.responseText;
testy = JSON.parse(dane);
for(var x = 0; x<testy.length;x++){
var a = testy[x][0];
var b = parseFloat(a);
var c = testy[x][1];
var d = parseFloat(c);
locations.push({lat: b , lng: d});
}
// Add some markers to the map.
for (var j = 0; j<testy.length;j++){
var marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[j]),
map,
})
nowa.push(marker);
};
const markerCluster = new markerClusterer.MarkerClusterer({ map, nowa });
// Add a marker clusterer to manage the markers.
}
}
}