Le portail francophone de la géomatique

Sylvain M. · Tue 29 March 2016 14:30

Bonjour à tous,

(je pose beaucoup de question chez les voisins du Forum SIG, alors pour changer je viens un peu par ici :-) )

Sur une carte Leaflet, je tente d'adapter le contenu d'une infobulle générée d'après un GeoJson.
Je souhaiterais, si possible, poser des conditions dans cette popup.

Actuellement, avec quelques properties, ça marche comme ça :

Code:

layer.bindPopup('nom : ' + feature.properties.name + '<br>adresse : ' + feature.properties.adress)

Comme, pour certaines entités, le GeoJson n'a pas tous ces attributs, je souhaiterais poser une condition du style (3 essais infructueux ci-dessous) :

Code:

layer.bindPopup(if (feature.properties.name == undefined) { 'Pas de nom ' ;} else {'nom : ' + feature.properties.name ;} ;))
ou
layer.bindPopup(if (feature.properties.name is null) { 'Pas de nom ' ;} else {'nom : ' + feature.properties.name ;} ;))
ou
layer.bindPopup(if (typeof feature.properties.name != "undefined") { 'Pas de nom ' ;} else {'nom : ' + feature.properties.name ;} ;))

Une idée de la syntaxe pour cela ?

Merci à vous.

Sylvain M.

Dernière modification par Sylvain M. (Tue 29 March 2016 14:31)

Sylvain M. · Tue 29 March 2016 14:42

Comme souvent, c'est en posant la question qu'on trouve la réponse...
Bref, la solution était de créer une variable pour stocker cette valeur :

Code:

            onEachFeature: function (feature, layer) {
            
            var popupname = '';

        if (feature.properties.name == undefined) {popupname = 'Pas de nom';} else {popupname = feature.properties.name ;}
        layer.bindPopup(popupname);        
            }

Du coup, on doit pouvoir faire ça pour chaque propriété. Voire, construire le contenu entier de sa popup dans une variable, ce sera plus simple je pense.

Au cas où ce soit utile à d'autres !

A+

Sylvain M.

Dof · Tue 29 March 2016 14:47

Bonjour,
Pour plus de clareté, il serait preférable de sortir le text dans une variable, ex :

Code:

var le_text = '';

if (!feature.properties.name){
le_text = 'Pas de nom'
}
else {
le_text = 'nom : ' + feature.properties.name
}

layer.bindPopup(le_text);

Ou de manière plus concise en utilisant l'opérateur ternaire :

Code:

var le_text = (!feature.properties.name) ?  'Pas de nom'  : 'nom : ' + feature.properties.name;
layer.bindPopup(le_text);

Sylvain M. · Tue 29 March 2016 15:03

Merci Dof !
Je crois que nous étions arrivé à la même solution dans ta première proposition ;-) Mais la 2e est encore plus fun et me fait découvrir les "opérateurs ternaires" !
De manière clean, comment ferais-tu pour créer une popup basée sur plusieurs properties, avec des conditions pour plusieurs d’entre-elles ?
Ferais-tu une variable par properties ? Ou une fonction qui "concatène" le résultat de plusieurs conditions à la suite ?
(suis-je clair dans mes propos ... :-$ )

Merci encore !

Sylvain M.

Sylvain M. · Tue 29 March 2016 15:22

Désolé, je rajoute une dernière question bonus sur ce sujet :
Comment faire avec les properties dont le nom contient des caractères spéciaux ?
(en l'occurence : "@timestamp", puisque mon GeoJson est issu d'une requête sur Overpass)
Bien sûr, je peux renommer le champ dans le GeoJson, mais ça rajoute des étapes dans le processus : si je peux le gérer via une fonction JS, ce serait plus sympa.

Code:

layer.bindPopup(feature.properties.@timestamp)

Ne marche pas...

Merci !!!

Sylvain M.

Dof · Tue 29 March 2016 16:39

Pour la deuxieme question avec les caractères spéciaux, on peut utiliser la notation entre crochet qui devrait résoudre le problème:

Code:

layer.bindPopup(feature.properties['@timestamp'])

Pour la question précédente, je ferais un petit tableau d'objet et une petite boucle. Le tableau aura le libélé (ex : Nom) et la valeur de la propriété (name)

Code:

var attributs = [
{label: 'Nom', value: 'name'},
{label: 'Timestamp', value:'@timestamp'},
{label: 'Utilisateur', value: '@user'}
]


onEachFeature: function (feature, layer) {
    var popupname = '';
    for (var i = 0; i <attributs.length; i++){
       var current_attribut =   (!feature.properties[attributs[i].value]) ?  'Pas de ' + attributs[i].label +'<br>' : attributs[i].label+' : ' + feature.properties[attributs[i].value] +'<br>';
        popupname = popupname + current_attribut; // ou popupname += current_attribut (c'est pareil)
    }

        layer.bindPopup(popupname);  
}

Je n'ai pas testé, il est possible qu'il y ait une erreur...

Sylvain M. · Tue 29 March 2016 16:58

Dof a écrit:

Je n'ai pas testé, il est possible qu'il y ait une erreur...

Pas de souci : merci beaucoup ! Je planche là dessus et je reviens si j'ai des questions !

Dof a écrit:

Pour la deuxieme question avec les caractères spéciaux, on peut utiliser la notation entre crochet qui devrait résoudre le problème:

Testé et approuvé : MERCI !!!

A+

Sylvain M.

Communauté	Ressources	L'emploi	Le marché	L'association	Fils RSS
Forum Blogs Wiki Planet Sites amis	Agenda Biblio Fiches AMO-CNIG Paris PCGIS Téléchargements	Offres d'emploi Banque de CV Formations Démarche Métiers	Geo-Entreprises Geo-Communiqué Appels d'offres	L'association Qui sommes-nous ? Nous aider Bienfaiteurs Partenaires Historique Statuts	Tout le site Job Géomatique Services GeoBlogs ...	Faire un don Mentions légales

Le portail francophone de la géomatique

Annonce

#1 Tue 29 March 2016 14:30

[LeafLet] [Javascript] Condition if dans pour une popup

Code:

Code:

#2 Tue 29 March 2016 14:42

Re: [LeafLet] [Javascript] Condition if dans pour une popup

Code:

#3 Tue 29 March 2016 14:47

Re: [LeafLet] [Javascript] Condition if dans pour une popup

Code:

Code:

#4 Tue 29 March 2016 15:03

Re: [LeafLet] [Javascript] Condition if dans pour une popup

#5 Tue 29 March 2016 15:22

Re: [LeafLet] [Javascript] Condition if dans pour une popup

Code:

#6 Tue 29 March 2016 16:39

Re: [LeafLet] [Javascript] Condition if dans pour une popup

Code:

Code:

#7 Tue 29 March 2016 16:58

Re: [LeafLet] [Javascript] Condition if dans pour une popup

Pied de page des forums