Home > Net >  Edit - Second markercluster hiding behind first on map
Edit - Second markercluster hiding behind first on map

Time:03-08

Thank you - the above has been fixed. I have now created a second cluster however it is placed on the same coordinates and is now hiding behind the first. Does anyone know how to move this? Thank you!

var markers = new L.MarkerClusterGroup();

var secondmarkers = new L.MarkerClusterGroup();

      markers.addLayer(populationMarker = L.marker([currentLatitude, currentLongitude], { icon: populationIcon }).bindPopup(`The population of ${thisCountry.countryName} is ${thisCountry.countryPopulation}.`));

      markers.addLayer(capitalMarker = L.marker([currentLatitude, currentLongitude], { icon: cityIcon }).bindPopup(`The capital city of ${thisCountry.countryName} is ${thisCountry.countryCapital}.`));

      secondmarkers.addLayer(carMarker = L.marker([currentLatitude, currentLongitude], { icon: carIcon }).bindPopup(`They drive on the ${thisCountry.carSide} of the road in ${thisCountry.countryName}.`));

      secondmarkers.addLayer(currencyMarker = L.marker([currentLatitude, currentLongitude], { icon: dollarIcon }).bindPopup(`They use the ${thisCountry.currencyName} in ${thisCountry.countryName}.`));


                    //add cluster to map
                    mymap.addLayer(markers);

                    //add second cluster to map
                    mymap.addLayer(secondmarkers);

CodePudding user response:

You are adding the created marker to the map too and this is wrong (icon: carIcon }).addTo(mymap).bindPopup().

Change

 markers.addLayer(carMarker = L.marker([currentLatitude, currentLongitude], { icon: carIcon })
  .addTo(mymap)
  .bindPopup(`They drive on the ${thisCountry.carSide} of the road in ${thisCountry.countryName}.`));

to

 markers.addLayer(carMarker = L.marker([currentLatitude, currentLongitude], { icon: carIcon })
  .bindPopup(`They drive on the ${thisCountry.carSide} of the road in ${thisCountry.countryName}.`));
  • Related