web-dev-qa-db-fra.com

Comment générer un graphe de dépendance avec du texte

Existe-t-il un outil en ligne simple permettant de générer un graphique de dépendance (des zones reliées par des flèches) basé sur la saisie de texte, tel que:

A -> B

Un peu comme celui-ci:

www.websequencediagrams.com

(Il génère un diagramme de séquence)

graphdiagramutilities
41
hello_harry

graphviz est un outil permettant de générer des graphiques.

webgraphviz.com est une application Web qui utilise graphviz et vous permet de modifier le texte et d'afficher le graphique correspondant (il contient également 5 exemples/exemples).

graphviz prend les entrées comme ceci:

digraph G {
   A->B
}
54
Luis Muñiz

http://www.nomnoml.com

C'est en utilisant la syntaxe:

[A] -> [B]
6
fab

Je sais que c'est vraiment vieux, mais cela pourrait aider quelqu'un d'autre plus tard.

Personnellement, j'aime yUML.me

Compte tenu de la syntaxe suivante ...

[note: You can stick notes on diagrams too!{bg:cornsilk}],
[Customer]<>1-orders>[Order], 
[Order]++*-items>[LineItem], 
[Order]-1>[DeliveryMethod], 
[Order]*-products>[Product], 
[Category]<->[Product], 
[DeliveryMethod]^[National], 
[DeliveryMethod]^[International]

... vous pouvez générer un diagramme plutôt complexe. Et pour en faciliter l'utilisation, tout cela est présenté sous la forme d'une série d'URL simples que vous pouvez intégrer dans à peu près n'importe quel document Web.

  • Éditer plus tard - Pour revenir et éditer l'image plus tard: http://yuml.me/edit/5a963e1b
  • Image PNG - Pour les blogs, les wikis ou les courriels. Fond transparent: http://yuml.me/5a963e1b
  • Document PDF - Idéal pour l'impression. Zoom infini.
  • Image JPEG - Fond Uni. Joue mieux avec certains outils de bureau.
  • Fichier JSON - Pour enregistrer par programme les métadonnées.
  • Graphiques vectoriels SVG - Expérimental!
6
SireInsectus
  • Aller à cette page: Démo Interactive GraphSource
  • Basculez la liste déroulante ci-dessus sur "Liaisons dynamiques"
  • Entrez ces valeurs dans les champs
    • Source des nœuds: ['Dummy']
    • Source de bords: ['A->B', 'A->C', 'D->C', 'D->A']
    • Paresseux Node Définition: Vérifié
    • Source Node Liaison: function(Edge) { return /(.+)->(.+)/.exec(Edge)[1];}
    • Cible Node Liaison: function(Edge) { return /(.+)->(.+)/.exec(Edge)[2];}
    • Laissez le reste tel quel
  • Appuyez sur le bouton New Graph
  • Regardez l'animation et prenez une capture d'écran!
5
Sebastian

Ou vous pouvez utiliser sirène. https://mermaidjs.github.io/ , qui est également disponible dans les interprètes de Markdown.

2
M.Balázs