Diagrammes de Sankey

_images/SankeyPanneau.png

Démonstration

Pour une présentation en vidéos des fonctionnalités voir demo sankey.

Introduction

L’édition des diagrammes de sankey se fait au moyen de trois dialogues et d’une interaction directe dans la zone d’affichage (3) en utilisant souris et clavier pour dragger. Les trois dialogues qui sont lancés depuis les trois boutons de la zone de dialogue (2) sont:

  • Le dialogue noeud (2.1) qui controle l’affichage des noeuds.

  • Le dialogue liens (2.2) qui controle l’affichage des liens.

  • Le dialogue réglages (2.3) qui controle des paramétres généraux d’affichage.

Dialogue Noeuds

_images/DialogueNoeuds.png

Composé de 3 boutons servant à ajouter, mettre à jour et supprimer des noeuds et d’une zone qui permet d’éditer leurs attributs.

Pour la mise à jour et la suppression le noeud doit préalablement être sélectionné par le click gauche de la souris dans la zone d’affichage. Un noeud est identifié par son id mais celui ci n’est pas éditable.

Les trois boutons sont:

  • Ajouter: ajoute un noeud au diagramme avec les attributs documentés ci-dessous. Un nouvel « id » est donné à ce noeud.

  • Mettre à jour: met à jour les attributs modifiés d’un neud déjà existant.

  • Supprimer: supprime un noeud déjà existant.

Et les attributs:

  • Nom: label du noeud

  • Couleur donné par son nom (grey, blue) ou code (#FF0000)

  • Orientation:

    • Vertical: les flux entrants et sortants sont horizontaux

    • Horizontal: les flux entrants et sortants sont verticaux

  • Type:

    • Produit: les noeuds sont representé par des rectangles

    • Secteur: les noeuds sont representé par des ovales

  • Visible: possibilité de cacher les noeuds

Dialogue Liens

_images/DialogueLiens.png

Composé de 3 boutons servant à ajouter, mettre à jour et supprimer des liens et d’une zone qui permet d’éditer leurs attributs.

Pour la mise à jour et la suppression le lien doit préalablement être sélectionné par le click gauche de la souris dans la zone d’affichage.

Les trois boutons sont:

  • Ajouter: ajoute un lien au diagramme avec les attributs documentés ci-dessous.

  • Mettre à jour: met à jour les attributs modifiés d’un lien déjà existant.

  • Supprimer: supprime un lien déjà existant.

Et les attributs:

  • Source(n°) et Cible(n°): id des noeuds source et cible. Détermine le sens du flux. Pour connaitre les id des noeuds il faut clicker sur ces noeuds pour voir leur id dans le dialogue noeuds.

  • Valeur: épaisseur du lien pour l’échelle donné dans le dialogue réglage

  • Couleur donné par son nom (grey, blue) ou code (#FF0000)

  • Type:

    • Classic: sans flêche et le lien alterne une trajectoire horizontal et vertical pour atteindre sa cible

    • Flêche: avec flêche et même comportement que Classic

    • Court: avec flêche en ligne droite

  • Frozen:

Dialogue Réglages

_images/DialogueRéglages.png
  • Echelle: valeur de base pour un lien qui serait rendu avec une épaisseur de 100 pixels.

  • Filtre: le filtre cache les liens dont la valeur est en dessous de celle du filtre.

  • Layout: permet d’appliquer le layout (emplacement des noeuds, attributs des noeuds et liens) d’un diagramme déjà existant au diagramme courant. Pour pouvoir appliquer ce layout, la structure du diagramme doit être similaire (même id des noeuds et les liens doivent être les mêmes)

Affichage et interaction

L’interaction dans la zone d’affichage permet:

  • bouger les noeuds: click gauche et drag ( cliquer move_nodes)

  • bouger les labels des noeuds et des liens: touche Alt + click gauche et drag ( cliquer move_label )

  • déplacement de la sinuosité par click gauche sur celle ci (apparition d’un carré) puis drag ( cliquer move_sinuosity)

  • reorganiser l’ordre des liens entrants et sortants pour minimiser les croisements: click droit puis dialogue ( cliquer reorg_nodes_links):

    • Réorganiser les liens entrants

    • Réorganiser les liens sortants

Autres fonctionnalités

Le menu offre des fonctionnalités additionnelles

  • Réinitialiser: efface tous les noeuds et les liens du diagramme

  • Sauvegarde: le diagramme est sauvé en format JSON

  • Ouvrir

  • Publication du diagramme en deux format possibles:

    • SVG

    • PDF

Génération automatique de diagramme

L’application est capable de générer des diagrammes de sankey à partir d’un fichier excel. Les onglets requis sont un sous ensemble des onglets en sorties de l’application AFM Filières (voir Format du fichier Excel d’entrée). C’est ce qui permet entre autre de réprésenter sous forme de diagrammes de Sankey les sorties de AFM Filières. Cependant cette fonctionnalité peut être utilisé indépendamment.

Les trois onglets requis sont les deux onglets d’entrée:

  • Dim produits

  • Dim secteurs

en particulier les colonnes Sankey ? et Color qui sont utilisés pour cette application.

et l’onglet de sortie

  • result liste