diff --git a/administration/impressions.md b/administration/impressions.md index 476cfd462f074157c749306045e296cbf3e661d3..c5598984a0e0c9da94d2a85fd89b881213eff155 100644 --- a/administration/impressions.md +++ b/administration/impressions.md @@ -100,6 +100,153 @@ Comme je l'ai stipulé précédemment il y a plusieurs identifiants clés permet - **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. +### Cartes en comparaison + +Lors de l'utilisation du mode comparaison seule la carte principale (située à gauche) est imprimée par défaut, pour imprimer la carte de droite il faudra utiliser les balises **map_image_compare** et **map_legend_compare**. + +Une fois ceci fait on retrouvera la carte secondaire sur toutes les impressions qu'on soit ou pas en mode comparaison. Pour rendre ceci variable et afficher la carte secondaire uniquement si le mode comparaison est actif la variable scope **compare_mode** utilisée avec **ng-if** permettra de conditionner l'affichage. + +```HTML +<style> + #A4_print_template { + width: 21cm; + font-family: arial; + position: absolute; + } + #map_overview { + background-color: #D8D8D8 !important; + height: 4cm; + width: 4cm; + border: 1px solid black; + } + .map_image { + background-color: #D8D8D8 !important; + height: 22cm; + width: 14cm; + border: 1px solid black; + } + .map_image_compare_mode { + background-color: #D8D8D8 !important; + height: 11cm; + width: 14cm; + border: 1px solid black; + } + .map_legend { + width: 3cm; + margin-top: 16px; + } + .map_legend_compare_mode { + width: 3cm; + margin-top: 16px; + } + .color_blue{ + color: #424A96 !important; + } + .logo { + height: 2cm; + } + .container { + position: absolute; + } + #header_container{ + width: 18cm; + height: 2.5cm; + background-color: #D8D8D8 !important; + } + #footer_container{ + width: 18cm; + height: 1cm; + background-color: #D8D8D8 !important; + } + .header_content{ + margin-left: 10px; + } + .title{ + display: block; + font-size: 24pt; + font-weight: bold; + margin-top: 0.8em; + } + .headline{ + font-weight: bold; + font-size: 14pt; + } + .legend_headline{ + font-weight: bold; + font-size: 14pt; + color: black; + } + .footer_text{ + font-weight: bold; + font-size: 10pt; + margin: 0.3cm; + } + +</style> +<div id="A4_print_template"> + + <div id="header_container" class="container" style="top: 1.2cm; left: 1.5cm;"> + <div class="container" style="top: -0.5cm; left: 0cm;"> + <div class="header_content title color_blue">{{title}}</div> + <div class="header_content headline color_blue">{{headline}}</div> + </div> + <div class="container" style="top: 0.2cm; right: 10px;"> + <img class="logo" src="data:image/png;base64,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"> + </div> + </div> + <!-- Mode normal --> + <div ng-if="!compare_mode" class="container" style="top: 5cm; left: 1.5cm;"> + <label class="legend_headline">Légende</label> + <div id="map_legend"></div> + </div> + <!-- Mode comparaison --> + <div ng-if="compare_mode" class="container" style="top: 5cm; left: 1.5cm;"> + <label class="legend_headline">Légende</label> + <div id="map_legend"></div> + <div id="map_legend_compare"></div> + </div> + <!-- Mode normal --> + <div ng-if="!compare_mode" class="container" style="top: 4cm; right: 1.1cm;"> + <img id="map_image" class="map_image" src="images/transparent.png"> + </div> + <!-- Mode comparaison --> + <div ng-if="compare_mode"> + <div class="container" style="top: 4cm; right: 1.1cm;"> + <img id="map_image" class="map_image_compare_mode" src="images/transparent.png"> + </div> + <div class="container" style="top: 15cm; right: 1.1cm;"> + <img id="map_image_compare" class="map_image_compare_mode" src="images/transparent.png"> + </div> + </div> + + <div class="container" style="top: 24.5cm; left: 1.7cm; z-index: 9;"> + <!-- Pour afficher l'overview utiliser id="map_overview--> + <img id="map_overview"> + </div> + + + <div id="footer_container" class="container" style="top: 26.7cm; left: 1.5cm"> + <div class="container" style="top: 0cm; right: 0cm;"> + <div class="footer_text"> + <label class="color_blue">Source(s):</label> + + <label class="color_blue">{{sources}}</label> + </div> + </div> + <div class="container" style="top: 0cm; left: 5.5cm;"> + <!-- Pour afficher l'échelle actuelle utiliser {{map_scale}}--> + <div class="footer_text"> + <label class="color_blue"></label> + + <label class="color_blue">Echelle: {{map_scale}}</label> + </div> + </div> + </div> +</div> +``` + + + ### 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. diff --git a/images/impressions_7.jpg b/images/impressions_7.jpg new file mode 100644 index 0000000000000000000000000000000000000000..cc077cadf5d1b1f554f6a2cd0eef305db4edc0ea Binary files /dev/null and b/images/impressions_7.jpg differ