Estilo MarkerClusterer Icons?
-
27-10-2019 - |
Pregunta
Estoy usando MarkerCluster.js para crear agrupaciones en mi API de Google Maps.Los grupos funcionan como los quiero, sin embargo, quiero diseñar de manera diferente a los círculos amarillos, azules y rojos.Estaba tratando de usar MarkerStyleOptions y dice que tiene una variedad de estilos con el ícono de clúster más pequeño primero y el más grande al final.Intenté crear esto a continuación, pero estoy realmente confundido sobre qué sintaxis usar y no puedo encontrar ningún buen ejemplo.
var clusterStyles = [
[opt_textColor: 'white'],
[opt_textColor: 'white'],
[opt_textColor: 'white']
];
var mcOptions = {
gridSize: 50,
styles: clusterStyles,
maxZoom: 15
};
var markerclusterer = new MarkerClusterer(map, cluster, mcOptions);
Solución
Lo que debe hacer es usar la URL para especificar qué imágenes usar en lugar de las imágenes azul / amarillo / rojo que se están usando actualmente.Y probablemente sea una buena idea incluir también las opciones de altura y ancho.
var clusterStyles = [
{
textColor: 'white',
url: 'path/to/smallclusterimage.png',
height: 50,
width: 50
},
{
textColor: 'white',
url: 'path/to/mediumclusterimage.png',
height: 50,
width: 50
},
{
textColor: 'white',
url: 'path/to/largeclusterimage.png',
height: 50,
width: 50
}
];
Otros consejos
Nunca es demasiado tarde para publicar una respuesta útil, por lo que, además, puede revisar el Documentación de MarkerClusterer para IconStyle
<×UPDATE
También hay utilidad google maps v3 en github como lo indica ehcanadian