Layout et responsive

Par défaut, les dashboards sont responsive. Mais vous pouvez customiser comment les widgets seront afichés lorsque la taille de l'écran est trop petite. D'autre part, sur les petits écrans, les onglets seront remplacé par un menu déroulant pour choisir l'onglet.

Configuration

Il y a deux types de layouts de widgets:

• grid: c'est le layout par défaut. Les widgets sont disposés sur une grille. Vous pouvez avoir plusieurs widgets l'un à coté de l'autre dans le sens de la largeur. Ce layout fonctionne bien pour les écrans desktop et les tablettes, mais pas pour les mobiles.
• list: dans ce layout, les widgets sont affichés les uns au dessus des autres. Chacun prend 100% de la largeur de l'écran.

La configuration du Layout est dans la section Layout / Impression.

Il y a trois modes de configuration du Layout (et son adaptation aux petits écrans):

• Switch to list layout on mobile (default): dans ce mode, le layout est en mode grid sauf si la largeur de de l'écran est trop petite, et dans ce cas, le layout passe en mode list.
• Keep the grid layout on mobile: dans ce mode, le layout est toujours grid quelque soit la largeur de l'écran. Ce mode ne fonctionne que pour des dashoards spécifiques.
• Always use list layout: dans ce mode, le layout est toujours list quelque soit la taille de l'écran.

Choisir un dashboard en fonction de la résolution

La technologie responsive n'est pas la solution à toutes les situations. Si votre dashboard est composé de nombreuses grandes tables et de widgets avancés, même s'il s'affiche correctement sur mobile, son usage risque de ne pas être adapté. Sur mobile, on préfèrera plutôt afficher quelques KPIs principaux.

Une bonne approche pour proposer un dashboard adapté à chaque usage est de rediriger l'utilisateur mobile vers un dashboard adapté. Cela se réalise simplement dans Serenytics en ajoutant ce morceau de code dans l'entête du dashboard :

<script type="text/javascript">
if (screen.width <= 600) {
    document.location = "https://app.serenytics.com/viewer/mobile_specific_dashboard_UUID";
}
</script>

Afficher / Cacher dynamiquement un widget en layout List

Lorsque vous êtes en layout List, il existe une option pour afficher ou cacher des widgets.

Par defaut, tous les widgets sont affichés. Si vous ajoutez une variable srn_visibility_widget_ID_WIDGET (par exemple srn_visibility_widget_13 pour le widget 13) qui vaut hidden alors ce widget ne sera pas affiché.

Vous pouvez utiliser des boutons pour définir la valeur d'une telle variable et ainsi créer des dashboards où le Viewer peut afficher ou cacher certains widgets.

Cette option ne fonctionne que en layout List.