Connexions
Creez et personnalisez les connexions entre vos composants avec 6 styles de lignes, 7 types de chemins et des animations.
Les connexions (edges) representent les relations entre vos composants : flux de donnees, appels API, dependances, replications. Contrairement a de simples lignes, les connexions de Siovos Archi portent du sens et peuvent etre enrichies de metadonnees.
Creer une connexion#
Pour connecter deux nodes :
- Survolez le node source
- Des handles (points de connexion) apparaissent sur les 4 cotes
- Cliquez sur un handle et maintenez
- Glissez vers un handle du node cible
- Relacher pour creer la connexion
La connexion est automatiquement tracee avec le chemin optimal. Vous pouvez ensuite la personnaliser.
Reconnexion#
Pour modifier le point d'attache d'une connexion existante :
- Selectionnez la connexion
- Cliquez sur l'extremite a deplacer
- Glissez vers un nouveau handle
Types de relations#
Les connexions peuvent etre typees pour indiquer leur nature :
| Type | Icone | Utilisation |
|---|---|---|
depends_on | 🔗 | Dependance technique |
calls | 📞 | Appel HTTP/RPC/gRPC |
stores_in | 💾 | Ecriture de donnees |
reads_from | 📖 | Lecture de donnees |
authenticates_via | 🔐 | Flux d'authentification |
routes_to | 🔀 | Routage reseau |
replicates_to | 🔄 | Replication de donnees |
Le type de relation enrichit la semantique de votre architecture. L'analyse d'impact utilise ces informations pour comprendre les dependances.
Attribuez un type de relation via clic droit > Type de relation, ou dans le panneau de proprietes.
Styles de ligne#
6 styles pour differencier visuellement vos connexions :
| Style | Apparence | Usage typique |
|---|---|---|
| Solid | ━━━━━━ | Flux principal, connexions directes |
| Dashed | ─ ─ ─ ─ | Dependances optionnelles |
| Dotted | ······ | Relations futures ou planifiees |
| Dash-Dot | ─·─·─ | Connexions conditionnelles |
| Long Dash | ── ── | Replications |
| Double Dot | ·· ·· | Liens faibles |
Types de chemin#
7 formes de connexion pour adapter le trajet :
| Type | Description |
|---|---|
| Smoothstep | Angles arrondis (defaut) |
| Bezier | Courbe fluide |
| Step | Angles droits |
| Straight | Ligne directe |
| Side to Side | Connexion horizontale |
| Top to Bottom | Connexion verticale |
| Loop | Retour sur le meme element |
Le type Loop est utile pour representer les processus recursifs ou les callbacks.
Fleches (Markers)#
Indiquez la direction du flux avec les fleches :
| Option | Apparence |
|---|---|
| Aucune | ──────── |
| Fin | ────────▶ |
| Debut | ◀──────── |
| Les deux | ◀────────▶ |
Les fleches aux deux extremites sont utiles pour les communications bidirectionnelles.
Couleurs#
8 couleurs pour categoriser visuellement vos connexions :
- ⬛ Gris (defaut)
- 🔵 Bleu
- 🟢 Vert
- 🟠 Orange
- 🔴 Rouge
- 🟣 Violet
- 🔷 Cyan
- 🩷 Rose
Utilisez les couleurs de maniere coherente : par exemple, toutes les connexions HTTP en bleu, toutes les connexions base de donnees en violet.
Labels#
Ajoutez un texte descriptif sur vos connexions :
- Selectionnez la connexion
- Dans le panneau de proprietes, remplissez le champ Label
- Le label s'affiche au milieu de la connexion
Exemples de labels :
HTTPSPort 5432gRPCREST /api/usersasync
Edition inline#
Double-cliquez sur une connexion pour editer son label directement sur le canvas, comme dans draw.io.
Animation#
L'animation de flux de donnees montre la direction du flux visuellement :
- Selectionnez la connexion
- Activez Animer dans le panneau de proprietes
- Des points animes suivent le chemin de la connexion
L'animation s'adapte automatiquement au style de ligne et a la direction. Elle est particulierement efficace pour les demonstrations et les presentations.
Waypoints#
Pour des connexions complexes qui doivent eviter d'autres elements, ajoutez des points de controle :
- Selectionnez la connexion
- Cliquez sur la ligne pour ajouter un waypoint
- Deplacez le waypoint pour ajuster le trajet
- 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.
Reinitialiser le chemin#
Clic droit sur la connexion > Reinitialiser le chemin supprime tous les waypoints et revient au trajet automatique.
Double ligne#
Pour representer des connexions avec redondance ou haute disponibilite, activez l'option Double ligne :
- Selectionnez la connexion
- Activez Double ligne dans les proprietes (ou clic droit > Double ligne)
- La connexion s'affiche avec deux lignes paralleles
Bonnes pratiques#
Lisibilite#
Quelques principes pour des diagrammes lisibles :
- Evitez les croisements de connexions quand possible
- Utilisez les waypoints pour contourner les obstacles
- Limitez le nombre de connexions par node (5-6 maximum)
- Positionnez les nodes pour minimiser les distances
Coherence#
Adoptez des conventions et gardez-les :
- Meme style pour le meme type de flux
- Exemple : HTTP en bleu solid, async en orange dashed
- Documentez vos conventions dans la description du projet
Labels pertinents#
Soyez concis et informatif :
- ✅
HTTPS,gRPC,Port 5432 - ❌
Connexion HTTPS securisee vers le serveur
Incluez le protocole et/ou le port quand c'est pertinent.
Prochaines etapes#
- Nodes pour les types de composants
- Groupes pour organiser visuellement
- Proprietes semantiques pour enrichir vos connexions