google maps – agrupar marcas (cluster) para mejorar el rendimiento con marcadores masivos – libreria MarkerClusterer by maestrosdelweb.com

Fuente: maestrosdelweb.com

MarkerCulterer agrupa los marcadores y muestra la cantidad de marcadores que hay en cierto segmento. En la documentación en el directorio llamado examples, muestra varios ejemplos de como utilizar esta librería.

Estos son los posibles colores que se pueden mostrar en el mapa que viene por defecto:

  • Azul 2-9
  • Amarillo 10-99
  • Rojo 100-999
  • Violeta 1,000-9,999
  • Violeta oscuro 10,000+

El comportamiento que trae por defecto la clase MarkerClusterer se puede modificar en el tercer parametro. Las posibles opciones son:

  • gridSize: Número entero. Valor por defecto 60
  • maxZoom: Número entero entre el 1 al 23. Indica hasta donde debe hacer el agrupamiento
  • zoomOnClick: Valor booleano para hacer “zoom” al pulsar en el marcador. true ofalse. Valor por defecto true
  • averageCenter: Centrar aproximádamente el marcador. true o false. Valor por defecto true
  • minimumClusterSize: Número mínimo para agrupar los marcadores. Por defecto 2

styles: Es un array que contiene uno o varios objetos de MarkerStyleOptions.
Posibles valores son:

  • url: La dirección de la imagen a mostrar
  • height: El alto de la imagen
  • width: El ancho de la imagen
  • anchor: Array con la posición x y y de los números en la imagen. Por defecto centrado
  • textColor: Color de los números. Por defecto black
  • textSize: Tamaño de los números. Por defecto 11
  • backgroundPosition: Posición del fondo

Es importante el orden en que se indican los objetos en el tercer parametro de la clase MarkerClusterer, las imágenes se van a mostrar conforme al orden de los valores numéricos indicados en los colores por defecto.

También los números de imágenes a colocar son importante, ya que si se coloca uno, esa es la imagen a mostrar en cada uno de los niveles indicados en los colores, si son dos la primera representa el primer valor numérico y la segunda del segundo al quinto, si se colocan tres, la primera representa el primer valor numérico, la segunda el segundo y la tercera del tercero al quinto y así sucesivamente.

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s