Images avancées
Fonctionnalités d’image avancées dans rtSurvey : filigrane, affichage en grille de médias et annotations d’images.
Au-delà du type de question image standard, rtSurvey fournit des extensions pour filigraner les photos capturées et afficher plusieurs images dans une grille de médias. Ces fonctionnalités sont utiles pour les enquêtes basées sur des preuves où les photos doivent être marquées avec l’identité de l’enquêteur ou les métadonnées de l’enquête, et pour les interfaces d’examen visuel.
Filigrane
La fonctionnalité de filigrane superpose du texte ou une image sur une photo capturée avant qu’elle ne soit stockée. C’est utilisé pour marquer les photos de terrain avec la date, le nom de l’enquêteur, la localisation GPS ou toute autre donnée d’enquête — rendant plus difficile de faire passer des photos préexistantes comme des preuves fraîchement capturées.
Configuration
Utilisez watermark() dans la colonne calculation d’un champ image, combiné avec l’apparence callapi :
watermark(type, size, distance, color, shadow, rotate, blur)
| Paramètre | Description |
|---|---|
type | 'text' pour un filigrane textuel ; 'file' pour un filigrane image |
size | Taille de police en pixels (texte) ou taille du filigrane en % de la largeur de l’image (fichier) |
distance | Espacement entre les tuiles de filigrane répétées (pixels) |
color | Couleur du texte (couleur CSS ou hex). Non utilisé pour le type file |
shadow | Couleur de l’ombre (couleur CSS ou hex) |
rotate | Angle de rotation en degrés (ex. : 45 pour diagonal) |
blur | Opacité du filigrane (0 = invisible, 100 = complètement opaque) |
Exemple de filigrane textuel
Superposer le nom de l’enquêteur et la date du jour en diagonale sur chaque photo capturée :
| type | name | label | appearance | calculation |
|---|---|---|---|---|
| calculate | wm_text | `concat(pulldata(‘app-api’, ‘user.name’), ' | ||
| image | site_photo | Prendre une photo du site | watermark | watermark('text', 20, 60, '#ffffff', '#000000', 45, 40) |
Le texte du filigrane est pris depuis ${wm_text}. Définissez le champ de texte du filigrane avant le champ image dans le formulaire.
Exemple de filigrane image/logo
Superposer le logo d’une organisation (joint comme fichier média nommé logo.png) :
| type | name | label | appearance | calculation |
|---|---|---|---|---|
| image | evidence_photo | Prendre une photo de la preuve | watermark | watermark('file', 25, 80, '', '#000000', 0, 50) |
Annuler/Rétablir
L’éditeur de filigrane prend en charge l’annulation et le rétablissement — les enquêteurs peuvent revenir en arrière dans l’historique d’édition avant de confirmer la photo.
Mosaïque de filigrane
Le filigrane se répète (en mosaïque) sur toute l’image automatiquement. Le paramètre distance contrôle l’espacement entre les tuiles ; rotate contrôle l’angle de chaque tuile.
Widget de grille de médias
Le widget de grille de médias affiche une collection de fichiers médias (images, audio, vidéo) dans une mise en page en grille, permettant aux réviseurs ou enquêteurs de parcourir visuellement les fichiers capturés.
Ce widget est activé par l’apparence mediagridwidget et est généralement utilisé sur des champs note ou calculate pour afficher les médias précédemment capturés depuis un groupe de répétition.
Exemple : Afficher toutes les photos d’une répétition en grille
| type | name | label | appearance | calculation |
|---|---|---|---|---|
| calculate | photo_list | join(' ', ${site_photo}) | ||
| note | photo_review | Réviser les photos capturées | mediagridwidget |
Bonnes pratiques pour les photos filigranées
- Calculez toujours le texte du filigrane dans un champ
calculateau-dessus du champ image pour qu’il soit disponible lors de la prise de photo. - Utilisez un angle de rotation (ex. : 45°) pour rendre les filigranes plus difficiles à recadrer.
- Définissez l’opacité (
blur) entre 30-60% — suffisamment visible pour être lisible, suffisamment transparent pour ne pas obscurcir le sujet de la photo. - Incluez le nom de l’enquêteur, la date et les coordonnées GPS dans le texte du filigrane pour maximiser la valeur d’audit.
- Testez le rendu du filigrane sur l’appareil le moins puissant de votre parc — le filigrane basé sur canvas peut être lent sur les anciens matériels.
Limitations
- Le filigrane est appliqué côté client en utilisant l’API Canvas HTML5 — il nécessite un navigateur ou WebView capable.
- Les photos à très haute résolution peuvent prendre plusieurs secondes à filigraner sur les appareils bas de gamme.
- Les filigranes sont incorporés dans le fichier image — ils ne peuvent pas être supprimés après soumission sans édition d’image.
- Le type de filigrane
filenécessite que l’image logo soit jointe comme fichier média avec exactement le nom de fichier attendu.