Gis 4 Surcharger les infobulles

Comment surcharger rapidement et facilement les infobulles.
Afin de faciliter l’intégration du contenu des info-bulles du plugin GIS-4 et pour contourner le problème du langage Json, voici un exemple de code d’intégration par un inclure.

Depuis l’introduction de la nouvelle version de gis, nous sommes confrontés aux mêmes problèmes de personnalisations des informations liées aux markers.
Voici une solution pour agrémenter vos infobulles par des illustrations et des descriptions.
je vous propose dans notre exemple les modifications de l’apparence des marqueurs par des logo de mots clés, comme dans l’ancienne version de Gis escoitar.
Avec la possibilité d’ajouter l’option d’affichage des tracés de plusieurs fichiers KML ou GPX attaché à des objets.

Pack utilisé sur le site de randonnée nos-sentiers
Vous pouvez voir un aperçu sous Spip 3

Étant donné que le langage spip est traité en premier, cette méthode est transparente et ne pose pas de problème.

Le principe est simple : j’encode seulement le résultat des boucles, ce qui permet d’éviter les problèmes des virgules en trop et les cheveux blancs.

Dans le cas de l’affichage des points de géolocalisation attachés à un article dans une rubrique,
l’identité de l’article est reprise dans un inclure pour afficher le logo article, logo de l’auteur et petit plus, une boucle gis pour les distances entre l’utilisateur enregistré et les points de géolocalisation.

Le basculement de l’affichage

Première méthode avec un bouton de basculement entre :
“afficher les points de géolocalisation et cacher les tracés”
“afficher les tracés et cacher les points de géolocalisation"
les deux fichiers (inc_carte & inc_gpx) sont à placer dans le répertoire squelette.

Ne fonctionne pas sous Internet Explorer 8

Dans une boucle rubrique, que l’on peut appeler avec un mot clé technique :

<BOUCLE_RUBRIQUE(RUBRIQUES){!id_rubrique}{titre_mot=gis}>

<form method="post">
[(#ENV{on}|=={'Afficher tracés'}|?{
  '<input type="hidden" name="on" value=""/>
   <input type="submit"  value="Cacher tracés" />'
  ,
  '<input type="submit"  name="on" value="Afficher tracés"/>'
})]
</form>

[(#ENV{on}|=={'Afficher tracés'}|?{
  [(#INCLURE{fond=inc_gpx}{id_rubrique})],
  [(#INCLURE{fond=inc_carte}{id_rubrique})]
})]

</BOUCLE_RUBRIQUE>

Dans notre fichier inc_gpx :
une boucle qui reprend les urls des documents gpx dans un tableau #ARRAY, la variable point passe à « non » pour éviter de surcharger la carte.

#SET{url,#ARRAY}
<BOUCLE_ARTICLE(ARTICLES){id_rubrique}>
<BOUCLE_DOCUMENT(DOCUMENTS){id_article}{extension=gpx}>
#SET{url,#GET{url}|push{#URL_DOCUMENT}}
</BOUCLE_DOCUMENT>
</BOUCLE_ARTICLE>      
[(#INCLURE{fond=modeles/carte_gis,
  objets=articles,
  id_rubrique=#ID_RUBRIQUE,
  control_zoom=small,
  overview=oui, 
  fullscreen=oui,
  point=non,
  controle_type=oui,
  gpx=#GET{url}
})]

Dans notre fichier inc_carte :
l’appel sans la fonction de superposition des cartes avec clustering.

[(#INCLURE{fond=modeles/carte_gis,
  objets=articles,
  id_rubrique=#ID_RUBRIQUE,
  control_zoom=small,
  cluster=oui,
  overview=oui, 
  fullscreen=oui,
  controle_type=oui,
  clusterStyles=[(#ARRAY{
    url,#CHEMIN_IMAGE{bg_cluster.png},
    height,40, width,40,
    opt_textColor,#B9121B})],
})]

Deuxième méthode qui consiste à intégrer directement le code de façon classique (voir le même code ci-dessus ou la documentation du plugin gis).
Sans les options de basculement dans notre fichier rubrique.html les deux fichiers inc_gps et inc_carte peuvent-être supprimés.

La surcharge des infobulles

Dans le fichier gis_articles du répertoire json, remplacer le code :

"title":[(#TITRE_GIS*|sinon{#TITRE*}|supprimer_numero|json_encode)],                         
"description":[(#DESCRIPTIF_GIS|sinon{#DESCRIPTIF}|json_encode)]

par

"title":[(#INCLURE{fond=json/inc_bulle, id_article}|json_encode)]

Placer le fichier inc_bulle dans le répertoire json du plugin Gis.
Pour les informations sur les distances entre l’utilisateur et les points de géolocalisation.
Il faut avoir préalablement déclaré la variable qui va contenir l’id_gis de la session, par notre première boucle GEO_LON_LAT_USER.
Dans la boucle AUTEUR on récupère le logo d’un seul auteur pour l’article (le logo d’un co-auteur est toujours possible, mais demande une info-bulle hors norme).
Nos deux dernières boucle gis nous donnent les valeurs des distances,
comme décrit dans la documentation.
Voici son contenu :

<BOUCLE_GEO_LON_LAT_USER(spip_gis_liens){objet=auteur}{id_objet=#SESSION{id_auteur}}>
  [(#SET{user_geo,#ID_GIS})]
</BOUCLE_GEO_LON_LAT_USER>

<div style="width:200px;">
  [<a href="#URL_ARTICLE" title="<:suite:>">
    (#INFO_TITRE{article,#ID_ARTICLE})</a><br/>]
  [<a href="#URL_ARTICLE" title="<:suite:>">
    (#LOGO_ARTICLE|image_reduire{110}|image_recadre{80,80,center center})</a>]
<BOUCLE_ARTICLE(spip_auteurs_liens){id_objet=#ID_ARTICLE}{objet=article}>
  <BOUCLE_AUTEUR(AUTEURS){id_auteur=#ID_AUTEUR}{0,1}{tout}>
    [<a href="#URL_PAGE{auteur,id_auteur=#ID_AUTEUR}" title="<:contact:>">
    (#LOGO_AUTEUR|image_reduire{110}|image_recadre{80,80,center center}
      |sinon{Pas de logo auteur}
      |image_passe_partout{90})</a>]
    [<a href="#URL_PAGE{auteur,id_auteur=#ID_AUTEUR}" title="<:contact:>">
      <:auteur:>&nbsp;:&nbsp;(#NOM|couper{25})</a><br/>]
  </BOUCLE_AUTEUR>
</BOUCLE_ARTICLE>

<BOUCLE_GEO(GIS){id_article}>
  <BOUCLE_DISTANCE(GIS){id_gis=#GET{user_geo}}{gis distance}>
  [Adresse&nbsp;&agrave;&nbsp;(#DISTANCE|couper{5})&nbsp;<sup>km</sup><br/>]
  </BOUCLE_DISTANCE>
  [(#ADRESSE|couper{25})]
  [(#VILLE|couper{20})]	
  [((#REGION|couper{25}))]
</BOUCLE_GEO>

</div>

L’affichage des markers par mots clés

Un logo à la place du marker :
Dans notre exemple de site sur la randonnée, les mots clés vont déterminer, le type de randonnée par l’image du logo et la couleur les difficultés.
Dans le fichier gis_articles pour afficher un logo de 20 x 32 d’un mot clé associé à un article,
la boucle MOT récupère dans la variable l’url du logo_mot dans le groupes « marker » et ne prend plus par défaut le logo du point gis.

Une icône par défaut sera affichée en l’absence du logo, donc vous veillerez à placer le fichier marker_defaut dans le répertoire « images ».

<BOUCLE_art(ARTICLES){gis}{id_article ?}{id_rubrique ?}{id_secteur ?}{id_mot ?}{id_auteur ?}{recherche ?}{0, #ENV{limit,500}}{","}>
<BOUCLE_MOT(MOTS){id_article}{type=marker}>
#SET{url_logo,#LOGO_MOT{url}}
</BOUCLE_MOT>
</B_MOT>
#SET{url_logo,#CHEMIN_IMAGE{marker_defaut.png}}
<//B_MOT>	

		{"type": "Feature",
		"geometry": {"type": "Point", "coordinates": [#LON, #LAT]},
		"id":"#ID_GIS",
		"properties": { 
			"title":[(#INCLURE{fond=json/inc_bulle, id_article}|json_encode)]
			[(#SET{logo_doc,''})]
            
		    [(#SET{logo_doc,#GET{url_logo}|image_passe_partout{20,32}|image_recadre{20,32}})]			
			#SET{icon_w,#GET{logo_doc}|extraire_attribut{src}|largeur}
			#SET{icon_h,#GET{logo_doc}|extraire_attribut{src}|hauteur}
			#SET{icon_anchorPoint,''}
			[,"icon": (#GET{logo_doc}|extraire_attribut{src}|url_absolue|json_encode)],
			"icon_size": [(#VAL{91}|chr)]#GET{icon_w},#GET{icon_h}[(#VAL{93}|chr)],
			"icon_anchor": [(#VAL{91}|chr)][(#GET{icon_w}|div{2})],[(#GET{icon_h})][(#VAL{93}|chr)]
		}}</BOUCLE_art>

Retrouvez dans le pack zip les fichiers à inclure dans votre structure.

Discussion

11 discussions

  • 1
    Jmtconseils

    Bonjour,
    J’ai des auteurs avec plusieurs adresses géolocalisées. Je bute sur l’affichage de la bonne adresse (issue de la table gis) sur la carte, liée au point courant.
    Voici le code de mon fichier json/inc-bulle :

    <BOUCLE_carte (AUTEURS){gis}{id_auteur}{tout}>
    <h4><a href="#URL_AUTEUR">#PRENOM [(#NOM_FAMILLE|majuscules)]</a></h4> 
                <p>#ADRESSE_GIS<br>
                #CODE_POSTAL_GIS #VILLE_GIS</p>
    </BOUCLE_carte>

    _Avec ce codage, toutes les adresses s’affichent et je ne trouve pas la solution.

    Merci pour l’aide

    • Bonjour,
      Si tu est dans une boucle englobante GIS {id_gis} dans ta boucle ne le fait pas ?

    Répondre à ce message

  • Bonjour,
    Je n’ai pas trouvé la réponse dans les archives GIS je cherche

    Comment faire pour que l’infobulle d’un point géolocalisé s’affiche au survol de ce point ?

    Et non seulement avec un clic.

    Merci pour la ou les solutions .

    Répondre à ce message

  • 1

    Salut !
    Quelqu’un a t’il essayé d’utiliser ce plugin sur un site en SPIP 3.1 ou 3.2 ? Y-a t’il des retours ou c’est cuit ? merci.

    • Je ne touche pas à Gis. Cependant, s’il n’est pas marqué compatible avec une version, cela ne veut pas nécessairement dire qu’il n’est pas compatible, mais simplement que la compatibilité n’a pas été testée.

    Répondre à ce message

  • 1
    Rémi Clavier

    Bonjour
    Comment utiliser de manière simple la surchage des infobulles en lien avec le plugin Metadonnées photo 2.0.3 qui crée, pour chaque photo téléchargée géolocalisée (EXIF) un point géolocalisé attaché au DOCUMENT téléchargé et non à l’article.
    Pourriez vous me donner la syntaxe des fichiers nécessaires.
    Merci

    • Bonjour,

      Pour toutes vos questions et afin de vous assurer le suivi, il est préférable d’exposer votre problème sur le forum du plugin GIS 4.

      Cordialement Claude

    Répondre à ce message

  • 1

    Bonjour
    je me permets de reposer ma question précédente concernant gis 4
    j’ai identifié un souci, à savoir que la carte du sommaire comporte donc bien tous les points géolocalisés des articles de l’ensemble de mon site, que la carte de chaque rubrique (ou sous-rubrique) comporte elle aussi bien tous les points de chaque article de ces rubriques (ou sous-rubriques), mais j’ai une rubrique qui ne comporte que des sous-rubriques (ces sous-rubriques ont, elles, des articles avec des points, et leurs cartes fonctionnent) mais sa carte, elle, reste vide de point. Quelqu’un aurait-il une idée ? merci beaucoup de votre aide !

    • Bonjour,

      Pour toutes vos questions et afin de vous assurer le suivi, il est préférable d’exposer votre problème sur le forum du plugin GIS 4.

      Cordialement Claude

    Répondre à ce message

  • 2

    Bonjour,
    au risque d’être lourd je souhaiterais savoir comment faire simplement des liens depuis les titres dans les infobulles d’une carte du sommaire de mon site vers chaque article, tous les articles étant géolocalisés dans GIS.
    je n’y arrive pas malgré les posts du forum et les articles sur GIS. à ce sujet
    j’ai GIS 4 et SPIP 3.0.17 (sur MAMP en local pour le moment)
    merci pour votre aide !
    pfp

    • As-tu essayé cette solution de l’article GIS 4 ?

      Le contenu des infobulles est généré à partir des attributs title et description de chaque item retourné par les squelettes JSON. Vous pouvez surcharger ces squelettes afin de personnaliser le contenu des infobulles. Par exemple, nous souhaitons afficher une carte des points attachés aux articles du site, avec un lien vers l’article dans l’infobulle du marqueur.

      Tout d’abord on affiche la carte en insérant le code suivant dans notre squelette :

      [(#INCLUREfond=modeles/carte_gis,objets=articles,limit=1000)]

      Puis on copie le fichier plugins/gis/json/gis_article.html dans squelettes/json/gis_articles.html et on modifie son contenu en remplaçant la ligne :

      « title » :[(#TITRE_GIS*|sinon#TITRE*|supprimer_numero|json_encode)],

      par :

      [(#SETtitre,#TITRE*)]« title » :(#GETtitre,

    • Bonjour
      merci Claude pour ta réponse, cependant je n’ai pas réussi à la faire fonctionner. J’ai remarqué que quand j’utilise le paramètre ’objets’, ma carte n’affiche plus aucun point.
      A l’inverse j’ai pu quand même faire ce que je voulais en faisant ainsi (pour ceux que cela interesserait aussi) :

      affichage de la carte dans les codes des pages sommaire, rubrique et article :

      #MODELE{carte_gis, centrer_auto=oui, zoom=9, width=100%, height=400px, 
      scale=oui, cluster=oui}

      contenu du fichier GIS.HTML dans JSON :

      <BOUCLE_art(ARTICLES){gis}{id_article ?}{id_rubrique ?}
      {id_secteur ?}{id_mot ?}{id_auteur ?}{recherche ?}
      {0, #ENV{limit,500}}{","}>
      
      		{"type": "Feature",
      		"geometry": {"type": "Point", "coordinates": [
      #LON, #LAT]},
      		"id":"#ID_GIS",
      		"properties": {
      			[(#SET{titre,<a href="#URL_ARTICLE" 
      rel="bookmark">#TITRE</a>})]
      "title":[(#GET{titre}|json_encode)],
      			"description":[(#DESCRIPTIF|json_encode)][
      			(#LOGO_GIS|gis_icon_properties)]
      		}}</BOUCLE_art>

      ce n’est peut-être pas le plus académique mais cela fonctionne.

      Par contre j’ai identifié un souci, à savoir que la carte du sommaire comporte donc bien tous les points géolocalisés des articles de l’ensemble de mon site, que la carte de chaque rubrique (ou sous-rubrique) comporte elle aussi bien tous les points de chaque article de ces rubriques (ou sous-rubriques), mais j’ai une rubrique qui ne comporte que des sous-rubriques (ces sous-rubriques ont, elles, des articles avec des points, et leurs cartes fonctionnent) mais sa carte, elle, reste vide de point. Quelqu’un aurait-il une idée ? merci beaucoup !

    Répondre à ce message

  • 1

    Est-il possible de rajouter dans les infobulles (inc-bulle.html) l’adresse complète d’un point ? Comment faire ? QUelle boucle utiliser. MERCI à vous

    • Je me réponds !
      comme ca :)

      <BOUCLE_adresse(AUTEURS) {gis}{id_article ?}{id_rubrique ?}{id_secteur ?}{id_mot ?}{id_auteur ?}{recherche ?}{","}>
      [(#ADRESSE)] [(#CODE_POSTAL)] [(#VILLE)]
      </BOUCLE_adresse>

    Répondre à ce message

  • désolé pour le bruit ………

    ça a finit par fonctionner !! magigue

    merci pour cette contrib

    Répondre à ce message

  • Infobulles ?

    Bonjour
    j’ai suivi les indications données concernant l’infobulle (modification du fichier gis_articles et création d’un fichier inc_bulle dans le répertoire json du plugin Gis, et rien ne se passe ???
    (j’ai vider le cache ……… idem)

    j’appel la carte dans un squelette de cette manière :

    [(#INCLURE{fond=modeles/carte_gis,
    	autocenterandzoom=oui,
       objets=articles,
    	id_article})]

    et le résultat est toujours pareil , j’obtiens mon pointeur, si le clic, j’ai l’infobulle « basique »

    qu’est ce que j’ai loupé ?

    merci

    jacques

    Répondre à ce message

  • Effectivement l extension png du marker_defaut.png.png est double.

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

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

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom