I initially used an InfoBox to create a label for a marker with a custom icon. For the scenario of overlapping markers, the labels became illegible and so I had to look for a solution or alternative.
It was suggested in a previous question that I should make use of MarkerWithLabel. It definitely helps, but if the markers overlap exactly, you can see the label still coming through even after setting the opacity to 1 and making the background the same as the custom marker.
.labels {
background-color: #FF5959;
}
gmarker = new MarkerWithLabel({
position: someCenterPosition,
icon: customImageURL,
draggable: false,
raiseOnDrag: false,
map: map,
title: someTitle,
labelContent: aTitle,
labelAnchor: new google.maps.Point(someOffsetX, someOffsetY),
labelClass: "labels", // the CSS class for the label
labelStyle: {opacity: 1}
});
The 2 is actually the marker behind's label and 15 should be displayed on the front marker. I need to have the 2 and its background behind the marker with the label of 15.