Média

Principe

Il est possible de mettre à disposition des documents à travers Lizmap. Pour cela il faut simplement :

  • Create a directory called media (in lower case and without accents)

  • Mettez-y des documents : images, rapports, PDFs, vidéos, fichiers textes ou HTML

  • Icons such as SVG for vector layers

  • On peut utiliser des sous-répertoires par couche ou par thème : l’organisation du contenu du répertoire media est libre.

Lizmap utilise ce répertoire pour plusieurs raisons:

Ensuite dans Lizmap Web Client, on peut offrir un accès à ces documents pour 2 choses :

  • les popups : le contenu d’une ou plusieurs colonnes pour chaque géométrie peut préciser le chemin vers le média. Par exemple une colonne photo, ou bien une colonne pdf. Voir Popup.
  • the link provided for each group or layer in the Lizmap plugin Layers tab.

Le détail de ces utilisations est précisé ci-dessous.

Avertissement

Vérifiez les autorisations de fichiers du dossier media. Si le dossier n’est pas lisible, une erreur se produira.

Dot and dot-dot

On Linux, when you see dot ., it means « this directory ».

Two dots, .., one after the other, means « the directory immediately above the current one ».

The two dots notation is used in QGIS and Lizmap to go one level up in the tree related to the QGIS project, see Utilisez un seul dossier media pour de nombreux dossiers Lizmap.

Use for SVG

In the QGIS, you can use custom SVG, in your layouts, symbology etc.

QGIS will display a absolute path but in the project, a relative path is saved. In the screenshot below, you can notice the absolute path whereas if you open the QGS file in a text editor, it’s a relative path :

<prop v="../media/custom_svg/croissant.svg" k="name"/>

../../_images/media-custom-svg.jpg

The path is starting with ../media, it’s using the media folder described below.

Utilisez un seul dossier media pour de nombreux dossiers Lizmap

It’s possible to use a single media folder located in the root data folder. As the folder is located in the parent folder of the QGIS project, it’s allowed to use ../media in the QGIS project, for instance in the attribute table of a layer to access a media file.

This will make files inside this media folder available for all folders, for instance for Javascript, images, PDF…

├── media
│   └── js
│   |    └── default
│   |       ├── another_script.js
│   |       └── one_script.js
│   └── photo_1.jpg
├── my_repository
│   ├── project_a.qgs
│   ├── project_a.qgs.cfg
│   ├── project_b.qgs
│   └── project_b.qgs.cfg
└── other_repo
    ├── media
    │   └── js
    │       ├── default
    │       │   └── script_for_all_projects_in_other_repo.js
    │       └── project_x
    │           └── script_for_project_x.js
    ├── project_x.qgs
    ├── project_x.qgs.cfg
    ├── project_y.qgs
    ├── project_y.qgs.cfg
    ├── project_z.qgs
    └── project_z.qgs.cfg

Utilisation dans les popups

Principe

Comme décrit dans l’introduction ci-dessus, on peut utiliser un chemin de media dans les données de la couche spatiale.

Par exemple, si on souhaite que les popups liées à une couche affichent une photo qui dépende de chaque objet, il suffit de créer une nouvelle colonne qui contiendra le chemin de media vers la photo pour chaque ligne de la table attributaire de la couche. Et ensuite d’activer les popups pour cette couche.

Exemple

Ici par exemple la table attributaire d’une couche paysage configurée pour afficher des images dans la popup. L’utilisateur a créé un champ image dans lequel il place le chemin vers les images et un champ pdf dans lequel il met les chemins vers un fichier PDF décrivant l’objet correspondant à chaque entité.

id nom description photo pdf
1 Marais blabla media/photos/photo_1.png media/docs/paysage-1.pdf
2 Plage blibli media/photos/photo_2.png media/docs/paysage-2.pdf
3 Lande bloblo media/photos/photo_3.png media/docs/paysage-3.pdf

Note

Dans cet exemple, nous voyons que les images et les noms de fichiers PDF sont normalisés. Veuillez suivre cet exemple car il permet d’utiliser le calculateur de champ QGIS pour créer ou mettre à jour automatiquement les données de la colonne média pour l’ensemble de la couche.

Résultat

Voici les règles d’affichage dans la popup

  • Si vous utilisez une popup auto:

    • Si le chemin pointe vers une image, l’image sera affichée dans la fenêtre contextuelle. En cliquant sur l’image, l’image originale s’affichera dans un nouvel onglet.
    • Si le chemin pointe vers un fichier texte ou un fichier HTML, le contenu du fichier sera affiché dans la fenêtre contextuelle.
    • For any other file types, the popup will display a link to the document that users can download by clicking on the link.
  • If you are using a lizmap popup, ${name_of_the_field} will have the full URL to the media, starting by http. This needs to be encapsulated to some HTML, such as <img /> or <a href></a>.

  • Ensuite, si vous utilisez une popup qgis:

    • [% "name_of_the_field" %] retournera seulement la valeur du champ, comme media/test.pdf.
    • Donc pour les liens, vous devez utilisez du HTML, tel que <a href="[% "name_of_field" %]">Link</a>.
    • And for images, you need <img> (with an optional link to open it fullscreen) such as
<a href="[% "name_of_field" %]" target="_blank">
    <img src="[% "name_of_field" %]" border="0">
</a>

Illustration

Ci-dessous, une illustration d’une popup Lizmap affichant une photo, un texte et un lien dans la popup :

../../_images/features-popup-photo-example.jpg