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:> : (#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 à (#DISTANCE|couper{5}) <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.
Discussions par date d’activité
Une discussion
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 :
_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
Ajouter un commentaire
Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :
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.
Suivre les commentaires : |