Carnet Wiki

Astuces GIS

Version 27 — Juin 2017 JLuc

Quelques astuces pour GIS qui à terme seront déplacées dans un article de la rubrique du plugin.

Définir le logo des points avec des mots clés

Depuis GIS v2 on peut ajouter un logo aux points. Dans la v1 du plugin il existait une astuce qui permettait de définir le logo des points à partir du logo des mots clés d’un groupe spécifique. Pour les nostalgiques, il est toujours possible d’obtenir le même résultat en procédant comme expliqué ci-dessous.

1) créez un groupe de mots-clés nommé marker_icon et attribuez un logo aux mots-clés de ce groupe.

2) attachez un mot de ce groupe aux articles liés à vos points.

3) créez un squelette JSON personnalisé nommé gis_articles_logomot avec le contenu suivant :

  1. <BOUCLE_art(ARTICLES){gis}{id_article ?}{id_rubrique ?}{id_secteur ?}{id_mot ?}{id_auteur ?}{recherche ?}{0, #ENV{limit}}{","}>
  2. {"type": "Feature",
  3. "geometry": {"type": "Point", "coordinates": [#LON, #LAT]},
  4. "id":"#ID_GIS",
  5. "properties": {
  6.        "title":[(#TITRE_GIS*|sinon{#TITRE*}|supprimer_numero|json_encode)],
  7.        "description":[(#DESCRIPTIF_GIS|sinon{#DESCRIPTIF}|json_encode)]<BOUCLE_logomot(MOTS){id_article}{type=marker_icon}>
  8.        [(#LOGO_MOT_NORMAL|gis_icon_properties)]</BOUCLE_logomot>
  9. }}</BOUCLE_art>

Télécharger

4) utilisez le code suivant pour afficher une carte qui sera alimentée par votre squelette JSON personnalisé :

[(#INCLURE{fond=modeles/carte_gis,objets=articles_logomot})]

Et voilà :)

Permettre l’ajout d’une géolocalisation dans le formulaire public de modification d’événement

En partant de l’excellente contribution de mj
http://contrib.spip.net/Squelette-d-Agenda-grace-au-plugin-Agenda

J’ai fait évoluer le code de mod_evenement.html en y ajoutant ce bloc.

  1. <div>
  2.                 #BLOC_TITRE
  3.                 <:localiser:>
  4.                 #BLOC_RESUME
  5.                 <BOUCLE_agenda_gis(GIS){id_evenement}>
  6.                         [(#INCLURE{fond=modeles/carte_gis_preview,id_objet=#ID_EVENEMENT,evenement})]
  7.                 </BOUCLE_agenda_gis>
  8.                 #BLOC_DEBUT
  9.                 [(#INCLURE{fond=prive/inclure/gis_objet_formulaires,objet=evenement,id_objet=#ID_EVENEMENT,ajax})]
  10.  
  11.  
  12. #BLOC_FIN
  13.        
  14. </div>

Télécharger

Ce code doit figurer dans une boucle événement, à un endroit ou l’id_evenement est défini.

Dans le cas contrait il serait judicieux de faire afficher par le squelette un message signalant qu’il faut au préalable enregistre le nouvel évenement.

La boucle agenda_gis permet simplement de ne pas afficher de carte tant qu’il n’y a pas de point associé.

L’utilisation de des blocs dépliables n’est évidemment pas obligatoire (nécessite le couteau suisse) ; pour s’en passer, il suffit d’enlever toutes les balise commençant par #BLOC


proposition pour un nouveau paragraphe dans l’aide, par troOn

Appeler un point géolocalisé à partir d’un squelette

Il est parfois utile d’appeler un point sur une carte, directement à partir d’un lien ou d’un bouton contenu dans son squelette. Une fonction javascript a été ajoutée à cette effet (à partir de GIS 4.4.).

La fonction gis_focus_marker nécessite deux variables, d’abord l’ID du point géolocalisé, ensuite l’ID de la carte.

Prenons l’exemple d’une carte, dont les titres des points géolocalisés sont affichés à la suite. Si l’on désire que ces titres permettent de localiser immédiatement le point sur la carte quand on clique dessus, il suffit de s’inspirer du code ci-dessous.

  1. <BOUCLE_article(ARTICLES){id_article}>
  2.         <BOUCLE_carte(ARTICLES){gis}{id_article}{0,1}> [(#REM|{on teste que des points géolocalisés sont bien liés à cet article})]
  3.     [(#INCLURE{fond=modeles/carte_gis,id_article=#ID_ARTICLE})]
  4.  
  5.  
  6. <B_points>
  7.                 <ul>
  8.                 <BOUCLE_points(GIS){id_article}{par titre}>
  9.                 <li><a href="#map1" onclick="javascript:gis_focus_marker(#ID_GIS,1);">#TITRE</a></li>
  10.                 </BOUCLE_points>
  11.                 </ul>
  12.                 </B_points>
  13.                        
  14.         </BOUCLE_carte>
  15. </BOUCLE_article>

Télécharger


Essayons de regrouper des infos pour étendre GIS par ici pour en faire un bel article par la suite. (b_b)

Utiliser des fonds de carte personnalisés

Il est possible d’enrichir la liste des fonds de carte proposées par le plugin. Pour cela il suffit de compléter la variable globale $GLOBALS['gis_layers'] depuis votre fichier mes_fonctions.php :

  1. $GLOBALS['gis_layers']['dede'] = array(
  2.         'nom' => 'CloudMade',
  3.         'layer' => 'L.tileLayer("http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png")'
  4. );

Télécharger

Définition des valeurs à renseigner pour chaque couche ajoutée :

  • dede = identifiant technique de la couche
  • CloudMade = nom affiché pour la couche
  • layer = définition de la couche pour Leaflet (voir la documentation de Leafet)

API Javascript de GIS

L’objet de chaque carte est accessible de deux manières : depuis une variable globale mapXX (ou XX est l’id de la carte ciblée) ou depuis la propriété map de l’objet DOM contenant la carte.

  1. // récupérer la carte id 1 depuis la globale
  2. var map = map1;
  3. // récupérer la carte id1 depuis le DOM
  4. var map = $('#map1').get(0).map;

Télécharger

À partir de là on a accès à toutes les fonctions de l’API Leaflet pour la classe L.Map. En bonus, certaines fonctions internes de GIS sont aussi disponibles :

  • setGeoJsonFeatureIcon
  • setGeoJsonFeaturePopup
  • parseGeoJson
  • AddJSON et removeAllMarkers pour compatibilité avec GIS 3

Événements

L’objet de la carte déclenche deux événements : load et ready. On peut s’y brancher simplement à l’aide de jQuery :

  1. $('#map1').on('load', function(){
  2.         console.log(this.map);
  3. });
  4. $('#map1').on('ready', function(){
  5.         console.log(this.map);
  6. });

Télécharger

Pour compatibilité, il est aussi possible de se brancher sur l’événement load depuis une fonction de callback :

  1. callback_map1 = function(map) {
  2.         console.log(map);
  3. };

Télécharger

Par contre, cette fonction doit être déclarée de façon global pour être accessible depuis le modèle ou la saisie.

— 

Le geocoder déclenche l’événement complete au retour des résultats de la requête. On peut s"y brancher de la manière suivante :

  1. geocoder.on('complete', function(e) {
  2.         console.log(e.result); // e.result contient les données renvoyées par le geocoder
  3. });

Télécharger

— 

Appeller un callback quand on clique sur un point. La paramètre retourne l’id du point gis

  1.       function callbackmarkergis(id) {
  2.                   console.log(id);
  3.       }
  4.      
  5.  
  6.       $('#map1').on('ready', function(){
  7.          this.map.eachLayer(function(layer){  
  8.              layer.on('click', function(e) {
  9.                  if (layer.feature) {
  10.                     callbackmarkergis(layer.feature.id);  
  11.                  }
  12.              });
  13.           });
  14.       });

Télécharger

Ajouter plusieurs gpx/kml via le modèle

Depuis la version 4.40.0 :

Permettre depuis l’appel d’une carte gis dans le texte d’un article d’indiquer une liste de tracés kml, gpx ou autre.

Exemple : <carte_gis|point=non|kml=20,21,22,23,24>


gis_open_marker

De la même manière qu’il existe une fonction « gis_focus_marker », ne devrait-on pas créer une fonction « gis_open_marker » dans gis_utils.js ? Cette fonction permet d’ouvrir un popup sans centrer la carte sur le marker. C’est particulièrement utile lorsque l’on n’a pas beaucoup d’espace pour la carte et que l’infobulle que l’on veut ouvrir est grande :

  1. function gis_open_marker (id, map) {
  2.         var carte = eval('map'+ map);
  3.         var i, count = ;
  4.         for (i in carte._layers) {
  5.                 if ((carte._layers[i].feature) && (carte._layers[i].feature.id == id)) {
  6.                         carte._layers[i].openPopup();
  7.                 }
  8.                 count++;
  9.         }
  10. }

Télécharger


Critère {gis distance...}

Le critère {gis distance<30} filtre les objets dont la distance est inférieure à 30 par rapport au point de l’environnement.

Attention, {gis distance < 30} ne marche pas car il ne faut pas d’espaces !

Au cas où, il y a aussi le critère ’distancefrom’ : {distancefrom #ARRAY{lat,#LAT,lon,#LON},<,30}.


Récupérer les informations géographiques concernant des coordonnées latitude longitude

Les fonctions gis_infos_coordonnees et texte_infos_coordonnees définies ci-après reçoivent un tableau avec au moins une entrée lat et une entrée lon.
-  gis_infos_coordonnees renvoie un tableau php avec les informations complètes issues de l’interrogation ’reverse’ du géocodeur (nominatim par défaut) a propos des coordonnées reçues
-  texte_infos_coordonnees renvoie une chaine affichable présentant la localisation des coordonnées reçues. Exemple : Chemin de Saint-Victor, La Citerne, Fontjoncouse, Narbonne, Aude, Occitanie, France métropolitaine, 11360, France

  1. include_spip("inc/distant");
  2. include_spip('inc/modifier');
  3.  
  4.  
  5. // inspiré de action/gis_geocoder_rechercher;
  6. function gis_infos_coordonnees ($arguments) {
  7.  
  8.  
  9. if (!isset($arguments['lat']))
  10.                 return "il manque la latitude pour gis_infos_coordonnees";
  11.         if (!isset($arguments['lon']))
  12.                 return "il manque la longitude pour gis_infos_coordonnees";
  13.  
  14.  
  15. $geocoder = defined('_GIS_GEOCODER') ? _GIS_GEOCODER : 'nominatim';
  16.  
  17.         if (in_array($geocoder, array('photon','nominatim'))) {
  18.                 if ($geocoder == 'photon') {
  19.                         if (isset($arguments['accept-language'])) {
  20.                                 $arguments['lang'] = $arguments['accept-language'];
  21.                                 unset($arguments['accept-language']);
  22.                         }
  23.                         $url = 'http://photon.komoot.de/';
  24.                 } else {
  25.                         $url = 'http://nominatim.openstreetmap.org/';
  26.                         $arguments['format'] = 'json';
  27.                 }
  28.  
  29.                 $url = defined('_GIS_GEOCODER_URL') ? _GIS_GEOCODER_URL : $url;
  30.                 $url = "{$url}reverse?" . http_build_query($arguments);
  31.                 $data = recuperer_page($url);
  32.                 return json_decode($data, true);
  33.         }
  34. }
  35.  
  36. function texte_infos_coordonnees($latlon) {
  37.         debug_assert (isset ($latlon['lat']) and isset ($latlon['lon']), "oups texte_infos_coordonnees paeco_gis_infos_coordonnees ne reçoit pas lat et lon mais ".print_r($latlon,1));
  38.        
  39.         $data = gis_infos_coordonnees ($latlon);
  40.        
  41.         if (!$data) {
  42.                 return "Erreur interogation géocodeur";
  43.         }
  44.         if (!is_array($data)) {
  45.                 return $data;
  46.         }
  47.  
  48.  
  49. if (isset($data['display_name']))
  50.                 return $data['display_name'];
  51.         if (isset($data['address']))
  52.                 return print_r($data['adress'],1);
  53.  
  54.  
  55. return 'Format de réponse  du geocodeur foireux pour '.print_r($latlon, 1);
  56. }

Télécharger

Utiliser le geocoder depuis PHP

Pour récupérer les infos géocodés dans un tableau PHP sans les afficher

(code généraliste et devant être adapté à vos besoins)

  1. <?php
  2. include_spip("inc/distant");
  3. // inspiré de action/gis_geocoder_rechercher;
  4.  
  5.  
  6. function lg_gis_geocoder_rechercher_dist() {
  7.         include_spip('inc/modifier');
  8.  
  9.  
  10. $mode = _request('mode');
  11.         if (!$mode || !in_array($mode, array('search', 'reverse'))) {
  12.                 return;
  13.         }
  14.  
  15.  
  16. /* On filtre les arguments à renvoyer à Nomatim (liste blanche) */
  17.         $arguments = collecter_requests(array('json_callback', 'format', 'q', 'limit', 'addressdetails', 'accept-language', 'lat', 'lon'), array());
  18.  
  19.  
  20. $geocoder = defined('_GIS_GEOCODER') ? _GIS_GEOCODER : 'nominatim';
  21.  
  22.  
  23. if (!empty($arguments) && in_array($geocoder, array('photon','nominatim'))) {
  24.                 if ($geocoder == 'photon') {
  25.                         if (isset($arguments['accept-language'])) {
  26.                                 $arguments['lang'] = $arguments['accept-language'];
  27.                                 unset($arguments['accept-language']);
  28.                         }
  29.                         if ($mode == 'search') {
  30.                                 $mode = 'api/';
  31.                         } else {
  32.                                 $mode = 'reverse';
  33.                         }
  34.                         $url = 'http://photon.komoot.de/';
  35.                 } else {
  36.                         $url = 'http://nominatim.openstreetmap.org/';
  37.                         $arguments['format']='json';
  38.                 }
  39.  
  40.  
  41. $url = defined('_GIS_GEOCODER_URL') ? _GIS_GEOCODER_URL : $url;
  42.                 $data = recuperer_page("{$url}{$mode}?" . http_build_query($arguments));
  43.                 $data = json_decode($data,true);
  44.                
  45.                 return $data;
  46.         }
  47. }
  48.  
  49.  
  50. $reponse = array('');
  51. set_request("mode","search");
  52. set_request("q","marseille");
  53. set_request("format","json");
  54. set_request("limit","1");
  55.  
  56.  
  57. $arguments = collecter_requests(array('json_callback', 'format', 'q', 'limit', 'addressdetails', 'accept-language', 'lat', 'lon'), array());
  58. var_dump($arguments );
  59.  
  60.  
  61. $requete = lg_gis_geocoder_rechercher_dist();
  62.  
  63.  
  64. var_dump($requete);

Télécharger