En partie. draw.io peut partager des noms au moyen d’espaces réservés définis au niveau du fichier et déduire les couleurs à partir des données, mais sa documentation n’établit pas de synchronisation automatique et bidirectionnelle des noms, des couleurs et des liens entre des formes copiées sur différentes pages.

Pour une tâche sur Mac, la décision clé consiste à déterminer si vous devez réorganiser un seul diagramme ou gérer plusieurs versions dont les positions sont indépendantes. Appliquer une disposition réorganise les formes existantes ; gérer plusieurs pages distinctes implique de maintenir séparément leurs valeurs et leurs paramètres. Le processus ci-dessous utilise uniquement des nœuds fictifs et des fonctionnalités documentées de l’éditeur. Appliquer des dispositions pour réorganiser un diagramme

De quel type de synchronisation avez-vous besoin ?

Supposons que trois rectangles — Node A, Node B et Node C — apparaissent dans une disposition horizontale et une disposition verticale. Vous voulez que le nom, la couleur de remplissage et le lien de destination de chaque nœud soient identiques, même si sa position diffère. Cette demande recouvre plusieurs opérations distinctes :

Besoin Approche documentée Limite
Modifier la disposition des formes existantes Appliquer une disposition au diagramme actuel Réorganise les objets existants au lieu de gérer des vues parallèles
Réutiliser un nom sur plusieurs pages Référencer une propriété personnalisée du fichier dans les libellés Modifier la propriété partagée ; modifier directement un libellé est une opération distincte
Colorer les formes en fonction de leurs données Utiliser des règles de style au niveau de la page ou des espaces réservés de style pris en charge Les données correspondantes et les règles applicables doivent être maintenues
Donner la même destination aux formes répétées Définir explicitement leurs liens Un libellé partagé ne garantit pas une destination commune
Modifier n’importe quelle copie et propager les trois attributs Aucun processus complet n’est établi par la documentation citée Ne considérez pas la duplication de pages comme un système de synchronisation automatique

Ces distinctions découlent des portées documentées : les propriétés du fichier sont partagées entre les pages, les règles de style appartiennent à chaque page et les liens sont stockés dans les métadonnées des formes. Elles permettent un processus de maintenance contrôlé, mais n’établissent pas que les différentes copies deviennent un seul objet modifiable. Propriétés personnalisées globales, Modifier le style des formes avec des règles de style, Modifier les métadonnées d’une forme

Utilisez un seul ensemble de formes si seule la disposition doit changer

Si vous n’avez besoin que d’une seule disposition à la fois, gardez un diagramme modifiable unique. Vous éviterez ainsi le problème pratique de la maintenance de copies correspondantes. draw.io Desktop fonctionne sur macOS ; cette approche ne nécessite donc pas de déplacer la tâche dans un navigateur. Utiliser draw.io hors ligne

Créez les trois rectangles et reliez Node A à Node B, puis Node B à Node C. Attribuez-leur les libellés, les couleurs et les liens voulus avant d’expérimenter avec leur positionnement. Utilisez ensuite la commande de disposition documentée :

  1. Ouvrez Arrange > Layout.
  2. Choisissez une disposition appropriée, par exemple un flux horizontal ou vertical.
  3. Réglez les options et cliquez sur Apply.
  4. Vérifiez le résultat. Appuyez sur Cmd+Z pour annuler une disposition qui ne convient pas.

Les dispositions s’appliquent aux formes existantes et utilisent leurs connexions pour calculer leur positionnement. La documentation actuelle sur les dispositions distingue également le routage des connecteurs seuls des dispositions qui déplacent les formes. Ainsi, réorganiser les mêmes objets est la méthode prise en charge pour modifier leur présentation sans créer un autre ensemble de propriétés à harmoniser. Appliquer des dispositions pour organiser rapidement les diagrammes

Il existe une limite importante : appliquer des dispositions successives ne permet pas de basculer entre des vues enregistrées. La documentation indique que les dispositions sont calculées à partir de l’état actuel du diagramme ; en appliquer une autre ne permet donc pas de reproduire systématiquement une structure antérieure. Si vous devez conserver des positions distinctes et modifiables séparément, utilisez des pages distinctes et la méthode de maintenance ci-dessous. Appliquer des dispositions pour réorganiser un diagramme

Partagez les noms des nœuds entre des pages disposées indépendamment

Pour avoir simultanément une version horizontale et une version verticale, gardez les deux pages dans un même fichier. Commencez par créer une page nommée Wide, puis dupliquez-la et nommez la copie Tall. Le menu des pages documenté propose les commandes Duplicate Page et Rename Page. La duplication fournit une disposition de départ ; configurez explicitement les libellés partagés. Ajouter plusieurs pages à vos diagrammes

Définissez les noms au niveau du fichier

Ouvrez File > Properties, cliquez sur Edit Data et ajoutez les propriétés illustratives suivantes :

Propriété Valeur
nodeAName Node A
nodeBName Node B
nodeCName Node C

Utilisez Add Property pour chaque entrée, puis cliquez sur Apply. Les propriétés du fichier sont disponibles sur toutes les pages. En revanche, cliquer sur Edit Data sans rien sélectionner définit des propriétés pour la page actuelle. Cette distinction détermine si les noms peuvent être partagés entre les dispositions. Propriétés personnalisées globales

Faites référence à ces noms dans les libellés

Sur le premier rectangle, appuyez sur Cmd+M, activez Placeholders, puis cliquez sur Apply. Définissez son libellé sur %nodeAName%. Répétez l’opération avec %nodeBName% et %nodeCName% sur les autres rectangles. L’activation des espaces réservés et l’encadrement du nom d’une propriété par des signes pour cent constituent la configuration documentée des libellés. Utiliser des espaces réservés dans les libellés et les info-bulles

Dupliquez ensuite la page et réorganisez la copie. Pour renommer ultérieurement le nœud logique, modifiez sa propriété dans le fichier. Évitez d’ajouter une propriété du même nom à une forme, un conteneur ou une page : une propriété plus spécifique remplace la valeur du fichier. Propriétés personnalisées globales

Considérez le libellé comme une référence au nom partagé. Dans ce processus, modifiez les noms dans les propriétés du fichier au lieu de remplacer un libellé affiché par du texte littéral.

Gardez des couleurs cohérentes sans supposer que les copies sont liées

Pour un petit diagramme, une mise à jour explicite du style suffit souvent. Appliquez un style à un rectangle, cliquez sur Copy Style dans l’onglet Style, sélectionnez le rectangle correspondant sur une autre page, puis cliquez sur Paste Style. Le formatage est appliqué au moment où vous exécutez la commande ; répétez l’opération après toute modification ultérieure. Les styles des formes et ceux des connecteurs doivent être copiés séparément. Copier et coller les styles des formes et des connecteurs

Si seule la couleur de remplissage doit changer, utilisez la commande de couleur Fill sur la forme cible. La copie d’un style entier peut appliquer plus de formatage que la seule couleur souhaitée. Modifier le style des formes

Utilisez des règles de page pour appliquer une convention de couleurs de façon répétée

Pour plusieurs nœuds répétés, définissez une convention illustrative : toutes les représentations de Node A sont bleues. Attribuez à chaque forme correspondante une propriété personnalisée nommée nodeKey avec la valeur A, à l’aide de Cmd+M et de Add Property. Les propriétés personnalisées sont prises en charge pour les formes et les connecteurs. Modifier les métadonnées d’une forme

Configurez la règle sur chaque page de disposition :

  1. Ouvrez File > Page Setup, puis Advanced.
  2. Cliquez sur Edit à côté de Style Rules, puis sur Add Rule.
  3. Faites correspondre la propriété nodeKey à l’aide de la comparaison = et de la valeur A.
  4. Choisissez Fill Color, sélectionnez le bleu et confirmez avec OK.

La règle applique un style aux formes correspondantes de cette page. Chaque page possède ses propres règles, et les règles de la page de destination s’appliquent lorsque des formes y sont copiées. Reproduisez la convention sur Tall ; toute modification ultérieure de cette convention nécessitera de mettre à jour les règles des deux pages. Il n’est pas possible de modifier un style contrôlé par une règle à l’aide du contrôle de formatage habituel tant que cette règle s’applique. Modifier le style des formes avec des règles de style

La documentation actuelle prend également en charge des valeurs de couleur dynamiques au moyen de stylePlaceholders=1, notamment le fragment de style fillColor=%color%;stylePlaceholders=1;. Cela permet d’établir que les couleurs peuvent suivre les données, mais pas que l’ensemble d’une forme copiée, lien compris, est synchronisé. Considérez cette méthode comme une solution avancée par rapport aux remplissages explicites ou aux règles de page. Référence des styles pour la génération de diagrammes par IA

Définissez les liens séparément et vérifiez leurs destinations

Ajoutez une troisième page nommée Details. Sur le rectangle Node A de chaque disposition, faites un clic droit, choisissez Edit Link, sélectionnez Details dans la liste des pages, puis cliquez sur Apply. Les deux rectangles auront ainsi explicitement la même destination. La documentation sur les pages indique également que le renommage d’une page de destination met automatiquement à jour le nom de la page liée. Ajouter plusieurs pages à vos diagrammes

Un nom partagé ne suffit pas à prouver que les destinations correspondent. La propriété documentée link appartient aux métadonnées de la forme ; vérifiez donc les deux rectangles lorsque vous modifiez leur destination. Modifier les métadonnées d’une forme

Pour les liens d’action personnalisés, draw.io documente la copie d’une liste d’actions ou de toutes les métadonnées d’une cellule. Cette dernière méthode utilise Edit > Copy Data et Edit > Paste Data dans l’onglet Style. Elle copie également d’autres métadonnées telles que les balises, les info-bulles et les espaces réservés. Réservez cette opération aux éléments cibles qui doivent recevoir le même ensemble de métadonnées. Copier des liens personnalisés et les métadonnées des cellules

Vérifiez le résultat avant d’ajouter d’autres dispositions

Effectuez ce petit contrôle d’acceptation sur le diagramme fictif. Il distingue les valeurs partagées des propriétés qui nécessitent encore une maintenance délibérée :

Vérification Résultat attendu
Remplacer la valeur de la propriété du fichier nodeAName par Node A Revised Les deux libellés avec espace réservé affichent le nom modifié
Déplacer le rectangle sur Tall La disposition indépendante souhaitée reste utilisable
Appliquer la convention bleue sur les deux pages Les deux rectangles correspondants affichent la couleur de remplissage choisie
Examiner le lien de chaque rectangle Les deux pointent vers Details
Modifier la destination souhaitée Chaque lien concerné est mis à jour délibérément et vérifié

Si un libellé affiche littéralement %nodeAName%, vérifiez que Placeholders est activé et que le nom de la propriété est correct. Si un seul libellé affiche une valeur inattendue, examinez les propriétés de sa forme, de ses ancêtres et de sa page pour repérer une valeur qui la remplace. Ces étapes de dépannage concernant les espaces réservés et leur portée sont documentées. Utiliser des espaces réservés dans les libellés et les info-bulles, Propriétés personnalisées globales

Ne remplacez pas ce processus sur Mac par une procédure d’actualisation depuis un tableur. La documentation actuelle sur les sources de données précise qu’elles ne peuvent pas être chargées dans draw.io Desktop. Elle indique également que l’actualisation est manuelle et que les liens fournis par la directive # link du modèle ne sont pas utilisés. Cette fonctionnalité ne répond donc pas au besoin de synchronisation sur ordinateur de bureau. Remplir et créer des formes à partir de fichiers Google Sheets et CSV

Pour travailler avec une seule disposition à la fois, gardez un seul ensemble de formes et réorganisez-le. Pour conserver plusieurs dispositions, utilisez des propriétés de nom partagées, une convention de couleurs explicite et des liens gérés séparément. Vous obtiendrez ainsi un résultat pratique et vérifiable, tout en respectant la limite clairement documentée : rien n’établit que les formes copiées constituent un système où les trois attributs seraient automatiquement modifiables partout.

Sources