Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found
Select Git revision

Target

Select target project
  • Documentation/doc_module_vmap
  • Gwendal/doc_module_vmap
  • carto/doc_module_vmap
3 results
Select Git revision
Show changes
Commits on Source (74)
Showing
with 740 additions and 15 deletions
# Documentation module vMap
Documentations des fonctionnalités de vMap
\ No newline at end of file
Documentation des fonctionnalités du module vMap
\ No newline at end of file
# Configuration du mode cartographie
Documentation en cours de rédaction..
......@@ -46,15 +46,16 @@ vous pouvez y intégrer le résultat d'un des attributs de la requête SQL Summa
- **Schéma :** schéma de la base de données
- **Table :** table de la base de données
- **SQL Summary :** requête SQL pour définir les champs à afficher dans
l’infobulle d’un objet, il est possible depuis la version 2018.01
d'intégrer des liens et des images en utilisant les balises HTML `<a>` et `<img>`
l’infobulle d’un objet.
- **Images et liens** : Il est possible depuis la version 2018.01.00 d'intégrer des liens et des images en utilisant les balises HTML `<a>` et `<img>`
- **Dates** : Il est possible depuis la version 2018.03.00 de formater les dates en fonction de la configuration de l'utilisateur en utilisant la fonction SQL `s_vitis.format_date()` exemple : `SELECT s_vitis.format_date(date_maj) as "Date MAJ" FROM ...`
![](../../images/infobulle.png)
- **SQL List :** requête SQL pour définir les champs à afficher dans la
liste des objets sélectionnés du requêteur, il est possible depuis la
version 2018.01 d'intégrer des liens et des images en utilisant les balises
HTML `<a>` et `<img>`
liste des objets sélectionnés du requêteur.
- **Images et liens** : Il est possible depuis la version 2018.01.00 d'intégrer des liens et des images en utilisant les balises HTML `<a>` et `<img>`
- **Dates** : Il est possible depuis la version 2018.03.00 de formater les dates en fonction de la configuration de l'utilisateur en utilisant la fonction SQL `s_vitis.format_date()` exemple : `SELECT s_vitis.format_date(date_maj) as "Date MAJ" FROM ...`
![](../../images/liste_requeteur.png)
......@@ -195,8 +196,7 @@ regrouper plusieurs éléments sur une même ligne.
![](../../images/formulaire_zone_attributs.png)
Le bouton **Sources de données** en bas de zone, permet la configuration
des attributs de type liste. En savoir plus sur le [Gestionnaire de
source de données](cas_utilisation_studio.html)
des attributs de type liste.
##### 3.2.2.4. La zone de définition de l'attribut sélectionné
......@@ -209,6 +209,6 @@ type d'attribut.
#### 3.2.3. Utilisation du studio
Pour comprendre comment utiliser le studio consulter le
document [Cas concrets d'utilisation du studio dans
vMap](cas_utilisation_studio.md)
Pour comprendre comment utiliser le studio consulter les documents suivants
- [Utilisation du studio](../../../doc_module_studio/utilisation/index.html)
- [Exemples d’objets métier dans vMap](../guide_developpeur/exemples_objets_metier.html)
# Interrogation GetFeatureInfo
*Disponible uniquement à partir de vMap 2018.03.00*
Dans vMap il est possible d'interroger les calques au travers d'objets métiers qui permettront en plus de la consultation des attributs, de mettre à jour la base de données, effectuer des jointures, visualiser des formulaires personnalisés interactifs etc...
Les objets métiers sont adaptés à l'utilisation dans vMap : ils ne permettront pas d'interroger une couche externe, ni d'interroger de façon attributaire une couche vMap depuis un logiciel tiers (FME, QGIS ...). Pour faire cela il faudra utiliser les fonctionnalités d'interrogation WMS par requête GetFeatureInfo.
Le GetFeatureInfo est une fonction du protocole WMS permettant d'intérroger une couche dans le but de recevoir les informations attributaires au format JSON, HTML, image ou texte. Dans la majeur partie des cas et dans vMap c'est le format HTML qui sera utilisé.
Depuis le mode cartographie, il suffira de cliquer sur la carte pour interroger toutes les couches actives au GetFeatureInfo. L'administrateur pourra définir à l'avance les couches interrogeables depuis le mode **calques et cartes** et l'utilisateur pourra à tout moment cocher/dé-cocher les couches interrogeables depuis le menu **jeux de données** situé sur la gauche.
![Utilisation GetFeatureInfo dans vMap](../images/getfeatureinfo/mode_carto.jpg)
## Utilisation dans le mode cartographie
### Sélection des calques et couches à interroger
L’administrateur aura déterminé à l’avance quels sont les calques interrogeables via GetFeatureInfo (voir partie administration), lors du dépliage du volet de gauche pour les calques définis comme interrogeables GetFeatureInfo une nouvelle boite à cocher apparaîtra et permettra à l’utilisateur de définir si le calque ainsi que ses couches seront interrogés.
Les boîtes à cocher peuvent avoir 3 états pour gérer les configurations intermédiaires (calques partiellement interrogeables).
![Selection couches GetFeatureInfo](../images/getfeatureinfo/mode_carto_2.jpg)
Les calques interrogeables sont ceux pour lesquels le service GetFeatureInfo a été défini. Cette définition n'est pas obligatoire, elle reste de la responsabilité du fournisseur de service.
### Clic sur la carte
Après avoir sélectionné la méthode d’interrogation, quand on clique sur un objet cartographique de la carte une fenêtre apparaît avec les différentes couches ainsi que le résultat HTML de la requête.
Comme la hauteur et la largeur du résultat peuvent être grandes, des barres de défilement apparaissent automatiquement.
![Utilisation GetFeatureInfo dans vMap](../images/getfeatureinfo/mode_carto.jpg)
On voit apparaître sur la carte en bleu le point qui a été cliqué, sur la droite de la carte une fenêtre résultante apparaît : on y retrouve la liste des couches potentiellement interrogeables de la carte, en cliquant sur un des éléments de cette dernière le résultat de la requête GetFeatureInfo correspondant s’inscrit sur la partie de droite de la fenêtre.
Sur la liste des couches interrogeables, on distinguera les couches avec et sans résultat.
Si pendant que la fenêtre résultante est affichée l’utilisateur effectue un autre clic sur la carte, alors les informations se rechargent, si une couche était sélectionnée dans la fenêtre elle restera affichée même si aucun résultat n’est ressorti.
La fermeture de la fenêtre contenant les informations entraîne la suppression du point bleu (localisation du clic).
Le résultat affiché est celui de la requête GetFeatureInfo, il peut donc être potentiellement incohérent si le serveur renvoie un message d'erreur ou des documents non html (xml, json…).
## Activation depuis l'interface d'administration
Pour activer les fonctionnalités d'interrogation WMS par requête GetFeatureInfo il faudra agir sur la **configuration de l'application**, sur les couches depuis le mode **MapServer** et sur les calques depuis le mode **calques et cartes**.
### Configuration
Dans le mode **configuration** puis dans la section **Configuration vMap** il est possible d'activer la fonctionnalité.
![Activation GetFeatureInfo](../images/getfeatureinfo/config_vmap.jpg)
### Mode MapServer
Pour que les couches puissent générer du GetFeatureInfo il faudra leur associer un **template**, pour cela il faudra le générer puis renseigner son emplacement dans la définition.
![Administration couche GetFeatureInfo](../images/getfeatureinfo/admin_couche.jpg)
Pour administrer le template il faudra de cliquer sur le bouton **Template GetFeatureInfo** qui va permettre d'éditer, générer et enregistrer le fichier au format HTML sur le serveur.
![Administration couche GetFeatureInfo](../images/getfeatureinfo/admin_couche_2.jpg)
Une fois le fichier enregistré, il faudra dans la définition de la couche placer dans chaque balise **CLASS** la ligne suivante :
```
TEMPLATE "../template/getfeatureinfo/{LAYER_NAME}.html"
```
Une dernière étape : renseigner le mime type au flux, pour cela il faudra ajouter dans le mode MapServer à l'objet web `"wms_feature_info_mime_type" "text/html"`
Exemple :
```
WEB
METADATA
"wms_title" "{WMSSERVICE_ID}"
"wms_onlineresource" "{WMSSERVICE_URL}"
"wms_feature_info_mime_type" "text/html"
"wms_srs" "EPSG:2154"
"wms_enable_request" "*"
END
# Les attributs TEMPLATE, IMAGEPATH et IMAGEURL sont ajoutés dynamiquement lors des tests. Ils sont inutiles en production
END
```
### Mode calques et cartes
Enfin il faudra au travers du formulaire du calque définir que ce dernier est interrogeable au travers de la requête GetFeatureInfo.
![Administration couche GetFeatureInfo](../images/getfeatureinfo/admin_calque.jpg)
# Filtres sur les couches
Il est possible d'ajouter des formulaires de filtre sur les couches dans le but de visualiser certaines données uniquement.
Alors les utilisateurs du mode cartographique auront accès à un bouton faisant apparaître le formulaire de filtrage, sur la carte "Carte de France" créée par défaut lors de l'installation de l'application un filtre est mis en place à titre d'exemple.
Sur la couche "Commune" un bouton de filtre apparaît
![](../../images/filtres_couches_1.jpg)
En cliquant dessus le formulaire suivant est affiché dans une fenêtre modale
![](../../images/filtres_couches_2.jpg)
L'utilisateur peut alors filtrer la couche pour afficher uniquement les communes ayant une population comprise dans la fourchette saisie par l'utilisateur, ainsi si on saisit 50000 à "Population suppérieure à" nous obtenons la carte suivante:
<img src="../../images/filtres_couches_3.jpg" width="45%" /> <img src="../../images/filtres_couches_4.jpg" width="45%" />
Pour ce faire il faudra effectuer plusieurs étapes détaillées ci-dessous.
## 1 - Écrire le filtre sur la couche Mapserver
Après avoir saisit le filtre, vMap va ajouter aux URL permanentant de récupérer les tuiles les paramètres saisis, dans le module Mapserver il est possible de récupérer et d'utiliser ces valeurs. Bien évidemment cette opération est également fonctionnelle si vous utilisez un autre générateur de flux WMS.
Sur le module Mapserver il faudra se rendre dans la définition de la couche pour y renseigner un filtre, nous allons détailler l'exemple des communes, mais si vous voulez plus de détails vous trouverez toute l'information disponible sur la documentation Mapserver http://mapserver.org/fr/cgi/runsub.html#filters
Dans notre exemple voici ce qui est écrit:
```
FILTER ([pop90] > '%pop90_sup%' and [pop90] < '%pop90_inf%')
VALIDATION
'pop90_sup' '^[0-9]*$'
'default_pop90_sup' '0'
'pop90_inf' '^[0-9]*$'
'default_pop90_inf' '100000000'
END
```
**Dans la balise FILTER** on écria la condition à respecter, les noms des colonnes devrons être écrites entre crochets ex: [pop90] et les noms des attributs récupérés à travers le l'URL (c'est à dire le formulaire de filtre) devront être écris entre pourcentages ex: %pop90_sup%
**La balise VALIDATION est obligatoire** et on doit y écrire pour chaque attribut récupéré à travers l'URL (c'est à dire le formulaire de filtre) une expression régulière empéchant les personnes mal intentionnées de faire des injections SQL, dans notre exemple nous avons écrit '^[0-9]\*$' ce qui signifie autant de chiffres entre 0 et 9 que souhaité. **Pour que la carte affiche des valeurs lorsque les filtres sont vides** il faudra définir des valeurs par défaut en écrivant default_[nom de votre attribut], dans notre exemple par défaut la carte filtre les villes entre 0 et 100000000 d'habitants.
On peut également utiliser la balise **FILTERITEM** pour faire un filtre plus générique:
```
FILTERITEM "id_com"
FILTER /%id_com%/
VALIDATION
"id_com" "^[a-zA-Z0-9_|]*$"
"default_id_com" "^[a-zA-Z0-9_|]*$"
END
```
## 2 - Mettre en place un formulaire de filtre
Pour mettre en place le formulaire il faudra aller dans la partie **calques** et mettre Oui à "Calque filtrable (Mapserver)"
![](../../images/filtres_couches_5.jpg)
Après avoir mis à jour le calque, une nouvelle section "Formulaire de filtre" va apparaître dans lequel vous pourrez mettre en place votre filtre.
![](../../images/filtres_couches_6.jpg)
# Autres exemples d'utilisation des filtres dans vMap
## 1 - Filtre textuelle non obligatoire et fonctionnement similaire au LIKE en SQL
Dans le studio il faudra définir un champ de type texte ou une liste déroulante avec une source de données adaptée.
Il faudra définir votre filtre pour qu'il utilise une valeur par défaut qui permettra de court-circuiter le filtre. (Dans le cas présent **'empty'**)
Si vous voulez un fonctionnement plus proche d'un LIKE SQL utilisez **~** à la place de **=**. (voir exemple ci-dessous)
```
FILTER (([type] = '%type%' or '%type%' = 'empty') and ([liketext] ~ '%liketext%' or '%liketext%' = 'empty')
VALIDATION
'type' '^empty|value_type_1|value_type_2|value_type_3$'
'liketext' '^empty|.{1,}$'
'default_type' 'empty'
'default_liketext' 'empty'
END
```
## 2 - Filtre sur une colonne de type date/timestamp
Pour filtrer sur un attribut unique de type date/timestamp référez vous à la documentation de MapServer http://mapserver.org/ogc/wms_time.html.
## 3 - Filtre sur plusieurs colonnes de type date/timestamp
Vue que la spécification d'un champ de type date/timestamp se fait dans la partie **METADATA**, il est impossible pour MapServer de traiter deux champs de ce type en théorie.
En réalité par un moyen détourné, il est possible de gérer autant de champs date/timestamp que vous voulez.
Pour l'exemple, je vais prendre trois champs en base creation_date (date de création d'un objet, type postgres timestamp with time zone), date_debut_travaux (une date de début de travaux pour un objet métier par exemple, type timestamp with time zone), duree_travaux_jour (la durée des travaux en jours à partie de la date de début, type integer)
### a - Adapter votre vue
Pour permettre à MapServer de les traiter comme des entiers il va falloir que la vue retourne des entiers.
Exemple de code permettant de faire cela :
```sql
date_part('epoch'::text, table.creation_date)::integer AS mstmstp_creation_date,
date_part('epoch'::text, table.date_debut_travaux)::integer AS mstmstp_date_debut_travaux,
date_part('epoch'::text, table.date_debut_travaux + table.duree_travaux_jour * '1 day'::interval)::integer AS mstmstp_date_fin_travaux
```
### b - Adapter votre formulaire avec le studio
Ajouter les champs dates que vous voulez. Dans le cas présent on va laisser la possibilité de prendre une date au dessus, en dessous, ou d'encadrer la/les date(s).
Pour chaque champ date il faut un champ caché. Le champ date va renvoyer une valeur formatée du type 'DD/MM/YYYY' ou 'YYYY-MM-DD', mais nous voulons un timestamp. Nous allons voir dans la prochaine partie comment utiliser un champ date pour remplir un champ caché avec un timestamp.
![](../../images/filtres_couches_exemples_1.jpg)
### c - Permettre au formulaire de calculer les timestamps
Il va falloir ajouter du code javascript spécifique à ce formulaire. Pour ce faire il va falloir changer de mode d'utilisation du studio, pour pouvoir éditer du javascript.
![](../../images/filtres_couches_exemples_2.jpg)
Vous allez arriver devant un champ vide.
Voici le code permettant de remplir les champs cachés pour l'exemple :
```javascript
/* global angular, goog, moment, vitisApp, bootbox */
// goog fonctionne en mode décompilé mais pas en mode compilé
console.info("filtre_mapserver_couche_NOM loaded --> your functions are ready");
/***********************************************************************************
filtre_mapserver_couche_NOM Javascript
***********************************************************************************/
var oFormRequired = {
"sUrl": "",
"scope_": {},
"toDestructor": []
};
/**
* constructor_form
* Fonction appelée à l'initialisation du formulaire
* @param {type} scope
* @param {type} s_url
* @returns {undefined}
*/
var constructor_form = function (scope, s_url) {
oFormRequired.sUrl = s_url;
oFormRequired.scope_ = scope;
var formaterStringFrom = "DD/MM/YYYY";
var formaterStringTo = "X"; // timestamp UNIX
oFormRequired.toDestructor.push(oFormRequired.scope_.$watch("oFormValues." + oFormRequired.scope_.sFormDefinitionName + ".creation_date_min_viz", function (value) {
if (typeof(value) !== "undefined" && value !== "") {
oFormRequired.scope_["oFormValues"][oFormRequired.scope_["sFormDefinitionName"]]["creation_date_min"] = moment(value, formaterStringFrom).format(formaterStringTo);
} else {
oFormRequired.scope_["oFormValues"][oFormRequired.scope_["sFormDefinitionName"]]["creation_date_min"] = null;
}
})
);
oFormRequired.toDestructor.push(oFormRequired.scope_.$watch("oFormValues." + oFormRequired.scope_.sFormDefinitionName + ".creation_date_max_viz", function (value) {
if (typeof(value) !== "undefined" && value !== "") {
oFormRequired.scope_["oFormValues"][oFormRequired.scope_["sFormDefinitionName"]]["creation_date_max"] = moment(value, formaterStringFrom).format(formaterStringTo);
} else {
oFormRequired.scope_["oFormValues"][oFormRequired.scope_["sFormDefinitionName"]]["creation_date_max"] = null;
}
})
);
oFormRequired.toDestructor.push(oFormRequired.scope_.$watch("oFormValues." + oFormRequired.scope_.sFormDefinitionName + ".tavaux_date_min_viz", function (value) {
if (typeof(value) !== "undefined" && value !== "") {
oFormRequired.scope_["oFormValues"][oFormRequired.scope_["sFormDefinitionName"]]["travaux_date_min"] = moment(value, formaterStringFrom).format(formaterStringTo);
} else {
oFormRequired.scope_["oFormValues"][oFormRequired.scope_["sFormDefinitionName"]]["travaux_date_min"] = null;
}
})
);
oFormRequired.toDestructor.push(oFormRequired.scope_.$watch("oFormValues." + oFormRequired.scope_.sFormDefinitionName + ".tavaux_date_max_viz", function (value) {
if (typeof(value) !== "undefined" && value !== "") {
oFormRequired.scope_["oFormValues"][oFormRequired.scope_["sFormDefinitionName"]]["travaux_date_max"] = moment(value, formaterStringFrom).format(formaterStringTo);
} else {
oFormRequired.scope_["oFormValues"][oFormRequired.scope_["sFormDefinitionName"]]["travaux_date_max"] = null;
}
})
);
};
/**
* destructor_form
* Fonction appelée quand on quitte le formulaire (ne pas modifier)
* @returns {undefined}
*/
var destructor_form = function () {
console.log("Destructor");
for (var i = 0; i < oFormRequired.toDestructor.length; i++) {
oFormRequired.toDestructor[i] = undefined;
delete oFormRequired.toDestructor[i];
}
//supprimer la balise script du js pour pouvoir le recharger si on revient sur le formulaire plus tard
angular.element('[src="' + oFormRequired.sUrl + '?version=' + oFormRequired.scope_["oProperties"]["build"] + '"]').remove();
oFormRequired = undefined;
delete oFormRequired;
constructor_form = undefined;
delete constructor_form;
destructor_form = undefined;
delete destructor_form;
};
/**********************************************************************************/
```
Ce code créé une instance pour surveiller les changements des champs dates (**$watch**) et utilise une librairie intégrée à Vitis (**moment.js**) pour parser la date, la transformer en timestamp Unix et stocker le résultat dans le champ caché.
### d - Intégration du filtre dans la couche MapServer
```
FILTER (([mstmstp_date_debut_travaux] < '%travaux_date_max%' or [mstmstp_date_fin_travaux] < '%travaux_date_max%') and ([mstmstp_date_debut_travaux] < '%travaux_date_min%' or [mstmstp_date_fin_travaux] < '%travaux_date_min%') and ([mstmstp_creation_date] < '%travaux_date_max%') and ([mstmstp_creation_date] > '%creation_date_min%'))
VALIDATION
'creation_date_max' '^[0-9]{1,}$'
'creation_date_min' '^[0-9]{1,}$'
'travaux_date_max' '^[0-9]{1,}$'
'travaux_date_min' '^[0-9]{1,}$'
'default_creation_date_max' '10000000000000000000000000'
'default_creation_date_min' '0'
'default_travaux_date_max' '10000000000000000000000000'
'default_travaux_date_min' '0'
END
```
......@@ -7,4 +7,5 @@ Guide du développeur
../../../doc_module_studio/utilisation/index.rst
web_services
filtres_couches
exemples_objets_metier
# Mode impressions
Documentation en cours de rédaction..
Le mode impressions fait partie des modes d'administration de vMap, il se compose de trois objets permettant de créer et modifier des modèles, des styles et des paramètres d'impressions.
![mode impressions](../images/impressions_1.jpg)
Une fois ces trois modes rensignés, les utilisateurs pourront utiliser depuis le mode vMap l'outil d'impression afin de générer des fichiers PDF avec des cartes, des paramètres et autres types d'entités.
![mode impressions](../images/impressions_2.jpg)
## Objet Modèles
La première des choses à faire est de créer un modèle d'impression, pour cela il faudra cliquer sur **Ajouter un modèle** et remplir le formulaire en associant un nom, un format d'impression, une orientation, les groupes d'utilisateurs qui pourront utiliser ce modèle ainsi qu'une définition HTML.
### Structure de la définition
Une définition est écrite en langage HTML et sera composée d'un style CSS ainsi que d'un corps, nous utiliserons par défaut la définition ci-dessous.
Il s'agit d'un modèle format A4 portrait, pour cela la première <div\> qui prend pour id #A4_print_template voit son style définir une hauteur de 21cm c'est à dire la hauteur d'une feuille A4.
Les identifiants map_legend, map_image et map_overview sont des mots clés permettant d'afficher les différents éléments cartographiques.
D'autres éléments comme les classes logo, head_element etc.. affichent des éléments de décoration, vous remarquerez qu'on utilise des logos au format base64 pour des soucis de performance et que par défaut les éléments sont en position absolue ce qui permet de les placer facilement dans la page.
Pour que les couleurs s'affichent correctement il faudra utiliser la syntaxe "!important".
```HTML
<style>
#A4_print_template {
width: 21cm;
}
#map_legend {
}
#map_image {
background-color: #DFDFDF;
height: 19cm;
width: 14cm;
border: 1px solid black;
}
#map_overview {
background-color: #DFDFDF;
height: 4cm;
width: 4cm;
border: 1px solid black;
}
.logo {
height: 1cm;
}
.head_element, .body_element, .footer_element {
text-align: center;
position: absolute;
}
</style>
<div id="A4_print_template">
<!-- Entête -->
<div class="head_element" style="top: 1.5cm; left: 2cm;">
<img class="logo" src="data:image/png;base64,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">
</div>
<div class="head_element" style="top: 1cm; left: 0cm; width: 21cm">
<h1 style="margin-bottom: 0px; padding-bottom: 0px;">{{title}}</h1>
<i>{{headline}}</i>
</div>
<div class="head_element" style="top: 1.5cm; left: 16cm;">
<img class="logo" src="data:image/png;base64,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">
</div>
<!-- Corps -->
<div class="body_element" style="top: 4cm; left: 1cm;width: 4cm;">
<!--Pour afficher la légende, utiliser id="map_legend"-->
<div id="map_legend"></div>
</div>
<div class="body_element" style="top: 4cm; left: 6cm;">
<!--Pour afficher la carte, utiliser id="map_image"-->
<img id="map_image" src="images/transparent.png">
</div>
<!-- Pied de page -->
<div class="footer_element" style="top: 24cm; left: 1cm;">
<!-- Pour afficher l'overview utiliser id="map_overview-->
<img id="map_overview">
</div>
<div class="footer_element" style="top: 27.5cm; left: 0cm; width: 21cm">
<label class="ng-binding">{{footer}}</label>
</div>
<div class="footer_element" style="top: 27.5cm; left: 17cm;">
<!-- Pour afficher l'échelle actuelle utiliser {{map_scale}}-->
<label class="ng-binding">Echelle: {{map_scale}}</label>
</div>
</div>
```
### Identifiants clés
Comme je l'ai stipulé précédemment il y a plusieurs identifiants clés permettant d'afficher des différents éléments cartgraphiques.
- **map_image** : si vous donnez cet identifiants à une balise **<img\>** alors la carte résultante de l'impression viendra s'y placer.
- **map_overview** : si vous donnez cet identifiants à une balise **<img\>** alors la carte de supervision y sera inscrite.
- **map_legend** : si vous donnez cet identifiants à une balise **<div\>** alors le contenu de la légende sera copié dedans.
### Variables disponibles
Tous les paramètres qui vous affecterez depuis le mode Paramètres seront interprétés comme des variables et pourront être incluses dans le résultat en les mettant entre crochets dans le définition.
Au même titre que les paramètres définis, certains paramètres dynamiques sont automatiquement affectés :
- **map_scale** : échelle de la carte imprimée
- **date** : date du jour
- **user_name** : nom de l'utilisateur
- **user_login** : login de l'utilisateur
- **user_company** : société de l'utilisateur
- **user_department** : service de l'utilisateur
- **user_email** : adresse mail de l'utilisateur
- **user_user_id** : identifiant de l'utilisateur
## Objet Styles
En renseignant des styles d'impressions, alors l'utilisateur pourra choisir le style qu'il souhaite utiliser lors de la phase de préparation.
![styles impression](../images/impressions_3.jpg)
Pour être utilisable chaque style devra être lié à un ou plusieurs utilisateurs, comme pour les modèles il faudra dans la partie définition écrire ne HTML un style CSS.
Ce style va venir surcharger celui du modèle et comme pour ce dernier, pour que les couleurs s'affichent correctement il faudra utiliser la syntaxe "!important".
![configuration styles impression](../images/impressions_4.jpg)
## Objet Paramètres
Ce dernier onglet va permettre à l'administrateur de définir les paramètres à saisir lors de la phase de préparation à l'impression, chaque paramêtre est lié à un modèle d'impression et est facultatif pour l'utilisateur.
Si un paramètre est non modifiable alors il sera caché dans le formulaire mais le résultat sera inclus dans l'impression.
![configuration styles impression](../images/impressions_5.jpg)
# Configuration du mode cartographie
La configuration du monde cartographique peut se faire de manière totalement graphique depuis l'interface mais pour des fonctions plus poussés elle se fait également en modifiant certains fichiers sur le serveur.
## Depuis l'interface de configuration
![Interface de configuration de vMap](../images/configuration_vmap_1.png)
### Général
#### Répertoire FOP
Chemin vers le répertoire où est installé FOP (nécessaire pour le module cadastre)
Défaut: */var/www/vmap/vas/server/fop*
#### Chemin vers PhantomJS (executable)
Chemin vers le répertoire où est installé PhantomJS (nécessaire pour les impressions)
Défaut: */var/www/vmap/vas/server/phantomjs/bin/phantomjs*
#### Alias pintserver
Alias Apache utilisé pour les impressions
Défaut: *printserver*
#### API Veremap
(Optionnelle) URL vers l'API de Veremap pour utiliser les flux privés de ce dernier
### Affichage
#### Largeur des tuiles WMS (en px)
Largeur en pixels des tuiles pour les flux WMS
Défault: *512*
#### Hauteur des tuiles WMS (en px)
Hauteur en pixels des tuiles pour les flux WMS
Défault: *512*
#### Style CSS des popup
Style CSS à appliquer aux info-bulles, ceci permet entre autres de gérer la taille de ces dernières
Défault: *max-height: 350px;max-width: 500px;min-width: 240px;*
#### Groupes de calques repliées par défaut dans "Jeux de données"
Définit si par défaut, dans la partie "Jeux de données" du bandeau de gauche, les groupes de calques sont repliés
#### Fenêtre "Jeux de données" repliée par défaut
Définit si par défaut, la partie "Jeux de données" du bandeau de gauche est repliée
#### Fenêtre "Table des matières" repliée par défaut
Définit si par défaut, la partie "Table des matières" du bandeau de gauche est repliée
#### Fenêtre "Légende" repliée par défaut
Définit si par défaut, la partie "Légende" du bandeau de gauche est repliée
### Outils
Active ou désactive les outils suivants
#### Slider de zoom
![Interface de configuration de vMap outils 2](../images/configuration_vmap_slider_zoom.png)
#### Zoom
![Interface de configuration de vMap outils 3](../images/configuration_vmap_zoom.png)
#### Carte de supervision
![Interface de configuration de vMap outils 4](../images/configuration_vmap_carte_supervision.png)
#### Échelle graphique
![Interface de configuration de vMap outils 5](../images/configuration_vmap_echelle_graphique.png)
#### Échelle numérique
![Interface de configuration de vMap outils 6](../images/configuration_vmap_echelle_numerique.png)
#### Nom de la carte
![Interface de configuration de vMap outils 7](../images/configuration_vmap_nom_carte.png)
#### Projection en cours
![Interface de configuration de vMap outils 8](../images/configuration_vmap_proj_en_cours.png)
#### Rafraichissement auto
Rafaichit automatiquement grâce à la technologie websocket les couches quand deux utilisateurs modifient la même donnée.
### Sélection
#### Nombre maximal de popups
Nombre maximal d'info-bulles affichables simultanément (valeur conseillée: 1)
#### Nombre maximal de sélections dans la liste
Nombre maximal d'enregistrements affichables simultanément dans le requêteur (valeur conseillée: 50)
## Configuration serveur avec properties_server.inc
En modifiant le fichier *vmap/vas/rest/conf/properties_server.inc* il est possible de configurer des fonctions plus approfondies.
#### $properties['schema_vmap']
Nom du schéma vMap utilisé par l'applicaiton
Défaut: *"s_vmap"*
#### $properties['use_proxy_for_tiles']
True pour utiliser le proxy pour charger les tuiles, ceci va diminuer les performances mais améliorera la gestion du cross-origin.
Défaut: *false*
#### $properties['cadastre']['api']
Api du module cadastre à utiliser
Défaut: *"cadastreV2"*
#### $properties['print']['equality_timeout']
Correspond au temps durant lequel le nombre de tuiles chargées est égal aux nombres de tuiles a charger a été mis en place.
En utilisant des services tuilés parfois certaines tuiles mettent énormément ou n'arrivent jamais, pour éviter que ceci bloque certaines impressions grâce equality_timeout l'impression se lancera même si certaines tuiles n'ont pas encore été chargées.
Augmenter equality_timeout améliorera vos chances d'avoir une meilleure impression mais augmentera le temps nécessaire à une impression
Défaut: *1000*
#### $properties['print']['tile_size']
Taille des tuiles durant une impression, en augmentant ce chiffre on diminue les performances mais on diminue aussi le risque qu'un libellé placé entre deux tuiles soit tronqué.
Défaut: *1024*
#### $properties['print']['features_zoom']
Pourcentage de zoom à appliquer quand on imprime une géométrie
Défaut: *100*
#### $properties['print']['quality']
Pourcentage de qualité d'impression
Défaut: *100*
#### $properties['use_veremap_api']
Définit si il faut utiliser l'API Veremap pour générer des flux privés
Défaut: *false*
#### $properties['use_vm4ms_api']
Définit si il faut utiliser l'API du module Mapserver pour générer des flux privés
Défaut: *true*
#### $properties['owner_login']
Login à utiliser pour effectuer les actions de super utilisation
Défaut: *$properties["vitis_owner_login"]*
#### $properties['owner_pass']
Mot de passe à utiliser pour effectuer les actions de super utilisation
Défaut: *$properties["vitis_owner_pass"]*
#### $properties['vmap_log_dir']
Chemin où écrire les fichiers de log
Défaut: *"{$properties['vas_home']}/log/vmap"*
#### $properties['vmap_map_log_file']
Chemin où écrire les fichiers de log pour l'utilisation des cartes
Défaut: *$properties['vmap_log_dir'] . '/map/' . date($properties["log_period"]) . '/map.log'*
#### $properties['vmap_geocoders']
Géocodeurs à utiliser par défaut
Défaut:
```
{"osm":{"title":"OpenStreetMap","url":"https://nominatim.openstreetmap.org/search?format=json&addressdetails=1&limit=[limit]&extratags=1&namedetails=1&polygon_geojson=1&countrycodes=fr&q=[search]","data_field":"data","title_field":"display_name","geojson_field":"geojson","summary_fields":[{"key":"address.country","label":"Pays"},{"key":"address.state","label":"Région"},{"key":"address.postcode","label":"Code postal"},{"key":"extratags.population","label":"Population"}]},"national_adresse":{"title":"Base nationale","url":"https://api-adresse.data.gouv.fr/search/?q=[search]&limit=[limit]","data_field":"data.features","title_field":"properties.label","geojson_field":"geometry","summary_fields":[{"key":"properties.context","label":"Département"},{"key":"properties.city","label":"Ville"},{"key":"properties.postcode","label":"Code postal"}]}}'
```
#### $properties['vmap_default_geocoders']
Géocodeur à utiliser par défaut
Défaut: *'osm'*
#### $properties['vmap_export']['gtf_api_url']
Permet l'extraction des données par GTF.
URL vers l'API de l'instance GTF à utiliser
#### $properties['vmap_export']['gtf_workspace_id']
Permet l'extraction des données par GTF.
Workspace id à utiliser lors de l'export
#### $properties['vmap_export']['gtf_priority_id']
Permet l'extraction des données par GTF.
Défaut: *'1'*
#### $properties['vmap_export']['gtf_email_option_id']
Permet l'extraction des données par GTF.
Défaut: *'1'*
#### $properties['vmap_export']['gtf_public_token']
Permet l'extraction des données par GTF.
Token public de l'instance GTF
Défaut: *'publictoken'*
#### $properties['vmap_export']['gtf_export_formats']
Permet l'extraction des données par GTF.
Formats supportés par GTF
Défaut:
```
$properties['vmap_export']['gtf_export_formats'] = '[{"label": "Shapefile", "value": "shape"}]'
```
#### $properties['vmap_export']['gtf_export_coordsys']
Permet l'extraction des données par GTF.
Systèmes de coordonnées supportés par GTF
Défaut:
```
$properties['vmap_export']['gtf_export_coordsys'] = '[{"label":"2154 Lambert 93","value":"2154"},{"label":"3857 WGS84 Spherical Mercator","value":"3857"},{"label":"4326 WGS84 Longitude latitude","value":"4326"},{"label":"27561 Lambert I Nord","value":"27561"},{"label":"27562 Lambert II Centre","value":"27562"},{"label":"27563 Lambert III Sud","value":"27563"},{"label":"27564 Lambert IV Corse","value":"27564"},{"label":"27571 Lambert I Carto","value":"27571"},{"label":"27572 Lambert II Carto","value":"27572"},{"label":"27573 Lambert III Carto","value":"27573"},{"label":"27572 Lambert IV Carto","value":"27572"}]'
```
## Configuration client avec properties.json
En modifiant le fichier *vmap/client/conf/properties.json* il est possible de configurer la partie client de l'application
#### Mode mobile
En passant `mobile_interface` à `true` les utilisateurs utilisant des smartphones pourront utiliser le mode cartographie en version mobile.
Cet interface est étidié pour être utilisé depuis le navigateur chrome de tout smartphone dont l'écran est de au moins 4 pouces, il peut être également utilisé depuis un autre navigateur mais il se peut que cela engendre certains bugs.
Il faudra activer le GPS du périphérique et autoriser la localisation depuis le navigateur pour utiliser les outils de localisation.
```
"mobile_interface": "true"
```
images/adresse.png

1.15 KiB

images/ajout_panier.png

704 B

images/ajout_selection.png

893 B

images/bandeau_panier.png

4.48 KiB

images/bati_non_bati.png

44 KiB

images/bouton_fiche_descriptive.png

679 B

images/bouton_fiche_urbanisme.png

960 B

File added
images/bouton_fiche_urbanisme2.png

711 B

images/bouton_impression.png

384 B

images/bouton_releve_propriete.png

981 B