Retina icons on are rendered with the wrong size (2x).
As you are using MarkerClustererPlus see this fiddle here:
http://jsfiddle.net/Rt28T/2/
This would be a viable fix (from the fiddle, thanks to the author of the
fiddle):
ClusterIcon.prototype.show = function () {
if (this.div) {
var img = "";
// NOTE: values must be specified in px units
var bp = this.backgroundPosition.split(" ");
var spriteH = parseInt(bp[0].trim(), 10);
var spriteV = parseInt(bp[1].trim(), 10);
var pos = this.getPosFromLatLng(this.center);
this.div.style.cssText = this.createCss(pos);
img = "<img src='" + this.url + "' style='position: absolute; top: " + spriteV + "px; left: " + spriteH + "px; ";
if (!this.cluster.getMarkerClusterer().enableRetinaIcons) {
img += "clip: rect(" + (-1 spriteV) + "px, " + ((-1 spriteH) + this.width) + "px, " +
((-1 * spriteV) + this.height) + "px, " + (-1 * spriteH) + "px);";
} else {
img += "width: " + this.width + "px;" + "height: " + this.height + "px;";
}
img += "'>";
Original issue reported on code.google.com by ckra...@comerge.net on 12 Jan 2015 at 8:16
ClusterIcon.prototype.show = function () { if (this.div) { var img = ""; // NOTE: values must be specified in px units var bp = this.backgroundPosition.split(" "); var spriteH = parseInt(bp[0].trim(), 10); var spriteV = parseInt(bp[1].trim(), 10); var pos = this.getPosFromLatLng(this.center); this.div.style.cssText = this.createCss(pos); img = "<img src='" + this.url + "' style='position: absolute; top: " + spriteV + "px; left: " + spriteH + "px; "; if (!this.cluster.getMarkerClusterer().enableRetinaIcons) { img += "clip: rect(" + (-1 spriteV) + "px, " + ((-1 spriteH) + this.width) + "px, " + ((-1 * spriteV) + this.height) + "px, " + (-1 * spriteH) + "px);"; } else { img += "width: " + this.width + "px;" + "height: " + this.height + "px;"; } img += "'>";
Original issue reported on code.google.com by
ckra...@comerge.neton 12 Jan 2015 at 8:16