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);
¿Fue útil?

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

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top