Comment ajouter des étiquettes de texte uniquement sur une carte de dépliant sans icône

Je cherche un moyen d'afficher du texte sur la carte Leaflet à l'aide de marqueurs ou de toute autre chose sans afficher d'icône. Je souhaite afficher uniquement le texte et pouvoir le styliser et le faire pivoter ... Une suggestion?

J'ai résolu mon problème en utilisant la fonctionnalité Leaflet L.DivIcon qui représente une icône légère pour les marqueurs qui utilise un simple élément div au lieu d'une image ... Ces marqueurs ont un html et une option className qui me permettent de créer des étiquettes avec css piloté modes...

Mise à jour pour Leaflet 1.0: à partir de Leaflet 1.0, le plugin Leaflet.label est obsolète, car il a été inclus avec le noyau de Leaflet L.Tooltip. Il n'est pas nécessaire d'inclure le script source et la syntaxe a légèrement changé. Exemple d'utilisation:

var marker = new L.marker([39.5, -77.3], { opacity: 0.01 }); //opacity may be set to zero
marker.bindTooltip("My Label", {permanent: true, className: "my-label", offset: [0, 0] });
marker.addTo(map);

Le style CSS peut être appliqué à la classe de la même manière qu'auparavant.

.my-label {
    position: absolute;
    width:1000px;
    font-size:20px;
}

Il apparaît également que l'opacité du marqueur peut être complètement réglée sur 0.

<script src="scripts/leaflet.label.js"></script>

Avec le plugin Leaflet Label, les étiquettes sont directement liées aux marqueurs, mais vous pouvez définir l'opacité du marqueur à presque zéro pour que seule l'étiquette soit visible. (Si vous définissez l'opacité du marqueur sur 0, l'étiquette associée disparaît également.)

var marker = new L.marker([39.5, -77.3], { opacity: 0.01 });
marker.bindLabel("My Label", {noHide: true, className: "my-label", offset: [0, 0] });
marker.addTo(map);

Vous pouvez ensuite utiliser CSS pour styliser vos étiquettes comme bon vous semble:

.my-label {
    position: absolute;
    width:1000px;
    font-size:20px;
}

Vous pouvez commencer ici avec ce plugin Leaflet . Créez ou modifiez probablement un marqueur à votre convenance. Le texte provient-il d'attributs d'entité?

marker.bindTooltip("text here", { permanent: true, offset: [0, 12] });

Ça marche pour moi