Style MarkerClusterer Icônes?

Je suis en utilisant le MarkerCluster.js pour créer des clusters dans mon api google maps. Les grappes de travail, comment je les veux mais je tiens à le style différemment que le jaune, le bleu et le rouge des cercles. J'ai essayé d'utiliser le MarkerStyleOptions et il dit que vous avez un éventail de styles avec le plus petit cluster icône de la première et la plus grande dernière. J'ai essayé de créer ce ci-dessous, mais je suis vraiment confus au sujet de ce que la syntaxe à utiliser et ne peuvent pas trouver de bons exemples.

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);
InformationsquelleAutor Louise McComiskey | 2011-10-20
  1. 90

    Ce que vous devez faire est d'utiliser l'url pour spécifier les images à utiliser à la place du bleu/jaune/rouge les images actuellement utilisé. Et probablement une bonne idée d'inclure la hauteur et la largeur des options de trop.

    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
  }
];
    • Salut Merci, 🙂 Oui j'ai utilisé cela et il a vraiment bien travaillé, je savais que je commençais juste la façon dont vous écrivez le tableau de mal. Une chose de plus est-il possible d'avoir des balises html de dire un <div> boîte avec un h2 et balise p, au lieu d'une image statique?
    • Pas à ma connaissance!
    • toutes les propriétés disponibles pour la v3: google-maps-utility-library-v3.googlecode.com/svn/trunk/...
    • Duncan, savez-vous si il est possible d'utiliser une icône plutôt que l'url de l'image? Je veux dire une icône construit avec google.cartes.SymbolPath.CERCLE, filColor etc.
    • Selon les commentaires dans le fichier JS ici ce n'est pas possible, c'est juste s'attend à une URL
    • C'est textColor, pas opt_textColor.
    • Si vous souhaitez créer des icônes simples plus dynamiques et performantes moyen, cochez cette question à propos de l'utilisation du format svg pour le marqueur de cluster: stackoverflow.com/questions/28178080/...
    • Désolé pour le retard comer. Pourquoi avez-vous 3 clusterer. Lorsque u zoom plus il devient moyen et grand droit?
    • oui exactement. Regardez par exemple ici, et de modifier le Cluster de Style et de regarder leur JS pour voir comment ils l'ont fait: googlemaps.github.io/js-marqueur-clusterer/exemples/...
    • de référence pour les propriétés de style est ici: googlemaps.github.io/js-marker-clusterer/docs/reference.html

    InformationsquelleAutor duncan
  2. 3

    Il n'est jamais trop tard pour poster un plutôt utile de répondre, en outre, vous pouvez regarder à travers l'ensemble de la MarkerClusterer Documentation pour IconStyle

    Mise à JOUR

    Il y a aussi google maps v3 utilitaire sur github comme l'a déclaré ehcanadian

    InformationsquelleAutor Yazan Rawashdeh