Connexions

Apprenez a creer et personnaliser les connexions entre vos nodes pour representer les flux de donnees et les dependances.

Vue d'ensemble#

Les connexions (edges) representent les relations entre vos composants : flux de donnees, appels API, dependances, replications, etc.

Creer une connexion#

Methode standard#

  1. Survolez le node source
  2. Des handles (points de connexion) apparaissent sur les 4 cotes
  3. Cliquez et maintenez sur un handle
  4. Glissez vers un handle du node cible
  5. Relacchez pour creer la connexion

Reconnexion#

Pour modifier le point d'attache d'une connexion existante :

  1. Selectionnez la connexion
  2. Cliquez sur l'extremite a deplacer
  3. Glissez vers un nouveau handle

Types de connexions#

➡️
Data Flow
Flux de donnees (trait plein + fleche)
🔗
API Call
Appel API synchrone
Dependency
Dependance logique (pointille)
Network
Connexion reseau (trait epais)
📤
Async
Message asynchrone (pointille + fleche)
🔄
Replication
Replication DB (double trait)

Personnalisation#

Selectionnez une connexion pour acceder au panneau de proprietes.

Style de ligne#

6 styles disponibles :

━━━ Solid─ ─ Dashed··· Dotted─·─ Dash-Dot── ── Long Dash·· ·· Double Dot

Type de chemin#

7 formes de connexion :

↪️ Smoothstep (defaut)〰️ Bezier⌐ Step⟶ Straight↔️ Side to Side↕️ Top to Bottom🔁 Loop

Fleches (Markers)#

──── Aucune────▶ Fin◀──── Debut◀────▶ Les deux

Couleurs#

8 couleurs pour differencier vos connexions :

⬛ Gris🔵 Bleu🟢 Vert🟠 Orange🔴 Rouge🟣 Violet🔷 Cyan🩷 Rose

Labels#

Ajoutez un texte descriptif sur vos connexions :

  1. Selectionnez la connexion
  2. Dans le panneau de proprietes, remplissez le champ Label
  3. Exemples : HTTPS, Port 5432, gRPC, REST /api/users

Edition inline#

Double-cliquez sur une connexion pour editer son label directement sur le canvas, comme dans draw.io.

Animation#

Activez l'animation de flux de donnees pour montrer la direction du flux :

  1. Selectionnez la connexion
  2. Cochez Animer dans le panneau de proprietes
  3. Des points animes suivront le chemin de la connexion

L'animation s'adapte automatiquement au style de ligne choisi.

Waypoints#

Pour des connexions complexes qui doivent eviter d'autres elements :

  1. Selectionnez la connexion
  2. Cliquez sur la ligne pour ajouter un waypoint
  3. Deplacez le waypoint pour ajuster le trajet
  4. Ajoutez autant de waypoints que necessaire

Les waypoints sont sauvegardes et persistent entre les sessions.

Supprimer un waypoint#

Double-cliquez sur un waypoint pour le supprimer.

Bonnes pratiques#

Lisibilite#

  • Evitez les croisements de connexions quand c'est possible
  • Utilisez les waypoints pour contourner les obstacles
  • Limitez le nombre de connexions par node (max 5-6)

Coherence#

  • Utilisez le meme style pour le meme type de flux
  • Exemple : toutes les connexions HTTP en bleu, toutes les connexions async en pointilles

Labels#

  • Soyez concis : HTTPS plutot que Connexion HTTPS securisee
  • Incluez le port si pertinent : TCP:5432
  • Indiquez le protocole : gRPC, WebSocket, AMQP

Prochaines etapes#

  • Calques : Organisez vos elements par calques
  • Templates : Exemples d'architectures pre-configurees