SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

290 Plugins, 198 contribs sur SPIP-Zone, 92 visiteurs en ce moment

Accueil > Géo, carto, météo > GIS > GIS : légende par mots clés

GIS : légende par mots clés

12 septembre 2018 – par flouvel – commentaire

4 votes

Ceci est une « contribution pédagogique », qui montre par l’exemple comment développer une nouvelle fonctionnalité pour SPIP.

Une carte s’interprète d’après une légende.
Sur une carte web, des éléments de cette légende peuvent permettre à l’utilisateur de choisir ceux qu’il veut voir afficher : gares, écoles, ...
Dans SPIP les objets peuvent être liés à des mots clés. Les mots clés peuvent être munis d’un logo.
Ce tutoriel propose d’utiliser ces logos de mots clés comme éléments de légende pour les objets « géotagués » (ayant un points gis) sur la carte. Un formulaire permettant de choisir les éléments à afficher.

Gis, légende par mots clés
Les mots « Jaune », « Bleu » et « Noir » ont été sélectionnés => seul les objets ayant ces mots clés sont présents sur la carte.

Supposons que vous ayez des rubriques ayant,
-  un mot clé appartenant au groupe 1 (ici nommé couleurs)
-  un (un seul dans cet exemple) point géolocalisé

Créons d’abord un formulaire avec les mots clés, le formulaire gismotslegende.html (mots clés, légende...) à enregistrer dans le dossier formulaires de vos squelettes :

  1. <div class="formulaire_spip formulaire_aform" id="formulaire_aform">
  2. <form method="post" action="#ENV{action}">
  3.   #ACTION_FORMULAIRE
  4.  <div class="editer-groupe">
  5.   <BOUCLE_motsgeo(MOTS){id_groupe=1}{"&nbsp; "}>
  6.   <div class="editer editer_checkbox">
  7.   <input type="checkbox" name="mots[]" id="mot#ID_MOT" value="#ID_MOT"[(#ENV{mots}|find{#ID_MOT}|oui) checked="checked"]  onchange="this.form.submit();" />
  8.   <label class="checkbox-inline" for="mot#ID_MOT">#LOGO_MOT #TITRE</label>
  9.   </div>
  10.   [(#SET{choixcouleur,[(#ENV{mots, #ARRAY{}}|push{#ID_MOT})]})]
  11.   </BOUCLE_motsgeo>
  12.  </div>
  13. </form>
  14. </div>

Télécharger

Le formulaire est à inclure dans la page qui va accueillir la carte gis, gis.html :

  1. <!DOCTYPE html PUBLIC (...)
  2. <body> (...)
  3. [(#FORMULAIRE_GISMOTSLEGENDE)]

Télécharger

Comme expliqué dans la documentation ce formulaire doit être accompagné d’un fichier php de traitement gismotslegende.php :

  1. <?php
  2. function formulaires_gismotslegende_charger_dist(){
  3.         $valeurs = array('mots'=>_request('mots'),);
  4.         return $valeurs;
  5. }
  6. function formulaires_gismotslegende_verifier_dist(){
  7.         $erreurs = array();
  8. }
  9. function formulaires_gismotslegende_traiter_dist(){
  10.         $res = array();
  11.         $mots[] = _request('mots[]');
  12.         return $res;
  13. }
  14. ?>

Télécharger

Bien. Maintenant nous voudrions que en sélectionnant un (ou des) mot(s) clé(s) de ce formulaire les rubriques ayant ce mot clé et un point géolocalisé soient affichées par le logo de ce mot clé sur la carte gis.

Comme expliqué dans la documentation de GIS 4 : « le paramètre objets permet de définir quel squelette sera utilisé pour générer les données JSON qui alimenteront la carte »
Il faut donc créer un nouvel objet, appelons le « motslegende », et le modèles appelant, gis_motslegende.html , à enregistrer dans le dossier json de vos squelettes :

  1. <BOUCLE_rub(RUBRIQUES){gis}{id_mot IN #ENV{mots}}{","}>
  2. <BOUCLE_gis(GIS){id_rubrique}>
  3.  {"type": "Feature",
  4.  "geometry": {"type": "Point", "coordinates": [#LON, #LAT]},
  5.  "id":"#ID_GIS",
  6.  "properties": {
  7.   "description": [(#DESCRIPTIF|sinon{#_rub:INTRODUCTION}|textebrut|concat{... <a href="#_rub:URL_RUBRIQUE">En savoir plus</a>}|replace{"'","\'"}|json_encode)][(#SET{logo_doc,''})]
  8. <BOUCLE_mot(MOTS){id_rubrique=#_rub:ID_RUBRIQUE}{id_groupe=2}{par hasard}{0,1}>[(#SET{logo_doc,#LOGO_MOT|image_passe_partout{32,32}})]</BOUCLE_mot>
  9. [(#GET{logo_doc}|oui)
  10. #SET{icon_w,#GET{logo_doc}|extraire_attribut{src}|largeur}
  11. #SET{icon_h,#GET{logo_doc}|extraire_attribut{src}|hauteur}
  12.  [,"icon": (#GET{logo_doc}|extraire_attribut{src}|url_absolue|json_encode)],
  13.  "icon_size": \[[(#GET{icon_w})],[(#GET{icon_h})]\],
  14.  "icon_anchor": \[[(#GET{icon_w}|div{2})],[(#GET{icon_h})]\],
  15.  "popup_anchor": \[1,[-(#GET{icon_h}|div{1.2})]\]]
  16. }}
  17. </BOUCLE_gis>
  18. </BOUCLE_rub>

Télécharger

Ce modèle inclus dans votre page gis.html ,

  1. <!DOCTYPE html PUBLIC (...)
  2. <body> (...)
  3. [(#FORMULAIRE_GISMOTSLEGENDE)]
  4. [(#MODELE{carte_gis,objets=motslegende,mots=#ENV{mots}})]
  5. (...)

Télécharger

permet alors via le formulaire mots clés (légende) et la variable #ENVmots, de choisir les rubriques que vous voulez afficher sur la carte GIS.
(Exemple : circuits escalade de bleau)


Remarque. Pour afficher plusieurs objets (rubriques + articles +...) sur une seule carte.
la table spip_gis_liens :

id_gis objet id_objet

la table spip_mots_liens :

id_mot id_objet objet

Pour généraliser le "json" à tout objet il faudrait (non testé) relier ces 2 tables par une jointure déclarée dans declarer_tables_interfaces et ainsi permettre :

  1. <BOUCLE_motsgis(spip_mots_liens spip_gis_liens){id_mot IN #ENV{mots}}{spip_mots_liens.objet=spip_gis_liens.objet}{spip_mots_liens.id_objet=spip_gis_liens.id_objet}{","}>
  2.   #ID_MOT ,  #ID_GIS , #ID_OBJET , #OBJET
  3. <BOUCLE_gis(GIS){id_gis}>
  4.         ... [#LON, #LAT] ... #LOGO_MOT ...

Télécharger

Dernière modification de cette page le 15 septembre 2018

Retour en haut de la page

Vos commentaires

  • Le 27 septembre à 18:48, par Racim En réponse à : GIS : légende par mots clés

    bonjour,

    superbe article.
    il serait bien que les admin de spip-contrib créent un mot-clé « contribution pédagogique », pour retrouver d’un lien ce genre d’articles.

    merci.

    Répondre à ce message

Répondre à cet article

Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • Jeux pour SPIP 3

    27 juillet 2012 – 53 commentaires

    Un portage pour SPIP 3 du plugin Jeux a été fait. Explications et nouveautés. Cet article concerne une mise à jour du plugin Jeux dont la description complète est disponible ici : Des jeux dans vos articles !. Le code du plugin Jeux est un code (...)

  • Plugin Vidéo(s)

    23 novembre 2010 – 704 commentaires

    Interface de gestion et modèle d’insertion des vidéos : Dailymotion Vimeo Youtube Modèle de la balise HTML5 video avec alternative flash html5media : Lecture HTML5/Flash pour tout navigateur des fichiers MP4/H264/Ogg/WebM/Mkv Support mobile, iPad, (...)

  • Vidéo Accessible

    6 avril 2011 – 168 commentaires

    Un plugin pour faciliter la diffusion de vidéos accessibles. Accessibilité des vidéos Accessibilité de la vidéo Afin d’être pleinement accessible, une vidéo (composée d’images et de sons) doit répondre à plusieurs critères. Le critère de base est (...)

  • Groupes de mots clés arborescents

    26 juillet 2012 – 37 commentaires

    Ce plugin permet de gérer une arborescence de groupes de mots clés. Les sous groupes de mots héritent des propriétés du groupe racine (sur quoi peut on le lier ? peut il y avoir un ou plusieurs mots). Les formulaires de liens qui permettent de lier (...)

  • Mailshot

    16 janvier 2013 – 336 commentaires

    Ce plugin prend en charge l’envoi en nombre d’info-lettres par email. Mailshot permet l’envoi en nombre d’emails au moyen d’un SMTP (ou d’un service externe) dédié à cet effet. Il permet de limiter la cadence d’envoi. Enfin, ce plugin implémente la (...)