Simple étiquette sur un feuillet (geojson) polygone

Je cherche ce que j'imagine être assez répandues cas d'utilisation avec un dépliant objet multipolygon.

J'ai créer le MultiPolygon à l'aide de geojson:

var layer = L.GeoJSON(g, style_opts);

Ce que j'aimerais c'est de mettre un simple texte de l'étiquette dans le centre de chaque polygone. (Par exemple, quelque chose comme mettre nom de l'état dans le centre de chaque état).

J'ai regardé:
https://groups.google.com/forum/?fromgroups=#!topic/dépliant-js/sA2HnU5W9Fw

Qui, de fait, se superpose au texte, mais lorsque j'ajoute un tas de polygones, il semble mettre l'étiquette-centre d'étranges façons, et je suis actuellement dans l'impossibilité d'éradiquer le problème.

J'ai aussi regardé: https://github.com/jacobtoye/Leaflet.label

mais qui semble ne mettre l'étiquette sur les polygones lorsque vous passez la souris sur le polygone, et ne pas rester statique sur le polygone.

Je crois que mon meilleur plan d'action est d'usage que le premier lien, et de traquer pourquoi c'est la modification de l'emplacement, mais en attendant, si quelqu'un connaît un moyen facile et rapide de poser une étiquette sur un polygone dans la fiche, je serais bien obligé.

Aussi, si j'ai des fausses hypothèses sur les deux liens ci-dessus, n'hésitez pas à redresser m'.

Merci beaucoup à l'avance.

  • Il est pathétique que 6 ans et 4 mois plus tard, il n'y a toujours pas une meilleure façon d'étiquette de polygones dans la fiche. Le construit dans l'info-bulle de la Classe de ne PAS fournir les mêmes fonctionnalités, et presque toujours exiger des modifications et des classes personnalisées pour imiter le vrai labels. Plutôt que de se plaindre, je devrais la fermer et de les écrire un plugin. En attendant, je tiens à ajouter ce lien dans l'image. Esri projet de fiche décrit cette méthode pour les étiquettes, qui fonctionne aussi très bien avec une Notice sur sa propre: esri.github.io/esri-leaflet/examples/labeling-features.html
InformationsquelleAutor Hoopes | 2012-11-09
  1. 22

    Le dépliant de l'étiquette plugin permet aussi statique étiquettes, consultez la démo.
    La seule raison pour laquelle la polyligne étiquette n'est pas statique, c'est qu'il se déplace à mesure que vous déplacez le long de la polyligne.

    Vous pouvez probablement le faire mieux que cela, en substituant bindLabel() pour les Polygones, mais c'est un moyen simple d'ajouter un label statique au centre d'un polygone:

    label = new L.Label()
label.setContent("static label")
label.setLatLng(polygon.getBounds().getCenter())
map.showLabel(label);

    http://jsfiddle.net/CrqkR/6/

    • Merci pour la réponse. Réussi à obtenir que cela fonctionne. Vous avez besoin d'ajouter l'étiquette de la carte avant d'appeler showLabel() si: label.addTo(map)
    • Je l'ai essayé et il fonctionne comme à l'écrit. Voir jsfiddle.net/CrqkR/6
    • Je dois avoir fait quelque chose de mal alors... merci pour la mise à jour
    • comme de la foliole 1.0 l'étiquette plugin a été remplacé par le nouveau cœur pour les info-bulles: leafletjs.com/reference-1.0.0.html#tooltip
    InformationsquelleAutor flup
  2. 14

    Vous pouvez utiliser le onEachFeature option de L.geoJson pour créer un nouveau L.divIcon pour chaque polygone.

    L.geoJson(geoJsonData, {
  onEachFeature: function(feature, layer) {
    var label = L.marker(layer.getBounds().getCenter(), {
      icon: L.divIcon({
        className: 'label',
        html: feature.properties.NAME,
        iconSize: [100, 40]
      })
    }).addTo(map);
  }
);
    • Comment voulez-vous faire ce travail si vous activez le "geoJsonData" comme une couche d'entités sur la carte? Votre méthode actuelle ajoute les étiquettes à la carte au départ. Merci pour les conseils.
    • si votre L.geoJson couche est enregistré dans une variable appelée geojson vous pouvez appeler geojson.clearLayers() et puis geojson.addData(newGeoJsonData)
    • vérifier ma réponse ici stackoverflow.com/questions/31691297/...
    InformationsquelleAutor Brendan Nee