Graphviz

De Wiki de Nelly & Richard
Aller à : navigation, rechercher

Les diagrammes GraphViz

  • Graphviz permet de réaliser des organigrammes facilement, utilisables en ligne de commandes il peut-être scripter, utilisé en PHP, ...
  • L'installation se fait via un apt-get -y install graphviz ou yum -y install graphviz
    • Graphviz est composé des programmes principaux suivants :
      • dotty  : gui pour la réalisation et/ou l'affichage de fichier .dot (mode graphique)
      • lefty  : gui pour la réalisation et/ou l'affichage de fichier .dot (mode texte)
      • dot  : conversion de fichier .dot hiérarchique standard
      • neato  : conversion de fichier .dot complexe en trame symetrique
      • fdp  : conversion de fichier .dot complexe en trame symetrique (plus complet que neato)
      • twopi  : conversion de fichier .dot complexe en trame circulaire
      • circo  : conversion de fichier .dot complexe en trame circulaire
  • Pour plus de détails : le site de Graphviz, la documentation en ligne est très complète.
  • L'extension pour mediawiki a été réalisé par CoffMan
  • Une alternative permettant d'utiliser les moteurs neato, fdp, ... est disponible ici.
  • Vous pouvez télécharger ici ce script php modifié par mes soins.

diagramme simple

graph_simple

explications :

 # prgm dot
 # dot fichier.dot -Tsvg -o fichier.svg
 digraph G{
   A -> B
 }
 

diagramme interactif

ABCGraphviz#diagramme interactifgraph_dimple_2

explications :

 # prgm dot
 # dot fichier.dot -Tsvg -o fichier.svg
 digraph G3 {
 	graph [URL="[[Graphviz#diagramme_interactif]]"]
 	a [URL="[[a]]"]
	b [URL="[[b]]"]
	c [URL="[[c]]"]
 	a -> b -> c
 	a -> c
 }

Les options principales

  • Voici quelques unes des options de graphviz
AccueilCuisineLinuxgraph_simple_3
  • Déclaration graph
digraph G {
  • Orientation du graph (LR, RL, BT, TB)
rankdir="LR"
  • Espacement entre les éléments
ranksep="2"
  • taille="largeur,hauteur"
size="12,9"
  • couleur du fond
bgcolor="lightblue2"
  • couleur - type - taille bordure - type de font - couleur de font - taille de font
node [color="green4", shape=box, style="setlinewidth(1)", fontname=schlbk, fontcolor="lightblue4", fontsize="16"]
  • couleur du lien - tête du lien
Accueil -> Cuisine [color="#7D8519" arrowhead="dot"]
  • couleur du lien - base du lien
Cuisine -> Accueil [color="#666666" arrowtail="ediamond"]
Accueil -> Linux
  • lien vers la page Cuisine - type
Cuisine [URL="Cuisine" shape="triangle" ]
Accueil [URL="Accueil" shape="Mcircle"]
Linux [URL="Linux"]
}

Clusters

  • Graphviz permet de faire des grappes grâce au préfixe cluster_ et au programme fdp :
Voici un graphique avec des bordures et des nœuds qui peut contenir des hyperliens.
  • syntaxe :
 # prgm fdp
 # fdp fichier.dot -Tsvg -o fichier.svg
 graph G {
  subgraph cluster_A {
    label="cluster_A"
    a -- b
  }
  subgraph cluster_B {
    label="cluster_B"
    c -- d
  }
  c -- cluster_A
  a -- d
  cluster_A -- cluster_B
 }

custom shapes

Il peut-être sympathique de créer des shapes personnalisée à partir de fichier png ou gif.

  • Allez, un petit exemple :

Le point attribut image doit être le nom d’un fichier téléversé.

  • syntaxe :
 digraph graph_dot {
  bgcolor="#F5F7D4"
  A [shape=none image="/chemin/vers/mynode.png"]
  B [shape=none image="/chemin/vers/mynode.png"]
  C [shape=none image="/chemin/vers/mynode.png"]
  A -> B
  A -> C
 }

record and html nodes

  • exemple :
Voici un graphique avec des bordures et des nœuds qui peut contenir des hyperliens.
  • syntaxe :
digraph recordgraph {
  node [shape=record];
  subgraph1 [label=" <s1f1> A| { <s1f2s1> K| { <s1f2s2> N| <s1f2s2> O } | <s1f2s3> M} | <s1f3> C"];
  subgraph2 [label=" <s2f1> D| <s2f2> E"];
  subgraph3 [label="<s3f1> F| { <s3f2s1> G| <s3f2s2> H} | <s3f3> I"];
  subgraph1:s1f1 -> subgraph2:s2f1;
  subgraph1:s1f3 -> subgraph3:s3f2s2;
  subgraph1:s1f2s2 -> subgraph3:s3f2s1;
 }

Scripts autour de graphviz

Petit script pour mediawiki

Ce petit script utilise gawk, il permet de réaliser pour une wiki basée sur mediawiki, la représentation graphique de votre wiki.

wiki_graphviz.awk

BEGIN {
        print "<graphviz>digraph G {\nsize=\"10,10\"\nnode [color=lightblue3, style=\"setlinewidth(3)\", shape=box]"
}

FNR != 1 {
        print $1 " -> " $2;
        print $2 " [URL=\"" $2 "\"]"
}

END {
        print "}</graphviz>"
}


wiki_graphviz.sh

#!/bin/bash
# script automatisant la réalisation du graph de la wiki sur sa page d'accueil

# déclaration des variables
wiki_data=/tmp/wiki_data.tmp
wiki_graphviz=/tmp/wiki_graphviz.tmp
wiki_awk=/opt/shell/wiki/wiki_graphviz.awk

# recupération des données
echo "SELECT page_title,pl_title FROM wiki_page INNER JOIN wiki_pagelinks \
 ON wiki_page.page_id = wiki_pagelinks.pl_from WHERE wiki_page.page_namespace = '0' \
 AND  wiki_pagelinks.pl_namespace = '0' ORDER BY pl_from;" \
 | mysql -uwikiuser -pwikipassword -Dwikidatabase > $wiki_data

# traitement des données récupérées
gawk -f "$wiki_awk" "$wiki_data" > "$wiki_graphviz"

# on affiche les données
echo "$wiki_graphviz :"
echo ""
cat "$wiki_graphviz"

Utilisation :

./wiki_graphviz.sh

Copier-coller le code généré dans votre wiki, Vous pouvez cliquer sur le graph il vous enverra où vous souhaitez.

Petit script pour mediawiki (alternative python)

Idem que le script précédent mais avec le choix de deux modes : catégories ou pages, il est disponible ici

Script PHP pour utiliser Graphviz via une page web

<?php

$prgmDOT = "/usr/bin/dot";
$fdot = "graph/hello.dot";
$fpng = "graph/hello.png";

$dot_data = "digraph G {
	node [ style=filled shape=box color=\"lightblue\" fontcolor=\"#FFF000\"]
	essai->ooo
	bidule->ooo
	test->ooo
	}";

$handle = fopen($fdot, "w");
fwrite($handle, $dot_data);
fclose($handle);

$cmdline = exec($prgmDOT . " -Tpng -o " . $fpng . " " . $fdot);

echo '<img src="' . $fpng . '" alt="graphviz" />';

?>

Script python pour générer un SiteMap

Applications utilisant graphviz

visitors

Visitors vous permet de réaliser rapidement une page html ou de texte brut afin d'analyser les visites d'un site web. Sur le site officiel vous pourrez trouver des informations complémentaires. Il peut utiliser graphviz aussi.

$ visitors -A --exclude "site1" --exclude "10.0.0.[0-9]*" /tmp/site.log > /tmp/site.html

Autres