106 votes

Quel outil utiliser pour dessiner une arborescence de fichiers

Étant donné une arborescence de fichiers - un répertoire avec des répertoires, etc., quel logiciel recommanderiez-vous pour créer un diagramme de l'arborescence de fichiers sous forme de fichier graphique que je peux intégrer dans un document de traitement de texte ? Je préfère les fichiers vectoriels (SVG, EPS, EMF...). L'outil doit fonctionner sous Windows, mais de préférence en multiplateforme. L'outil peut être commercial mais de préférence gratuit.

Mise à jour 2012-02-20. La question était liée à un sous-projet de documentation. Je devais expliquer où résident les fichiers (en particulier les ressources et les fichiers de configuration). J'ai fini par utiliser la commande dos tree. J'ai à la fois saisi l'écran du résultat (pour les dossiers courts) ET pour les dossiers plus longs, j'ai redirigé vers un fichier texte, que j'ai ensuite édité. Par exemple, si un sous-dossier contenait 20 fichiers de même type qui, individuellement, n'étaient pas importants pour mon propos, je n'en laissais que deux et remplaçais le reste par une ligne .... J'ai ensuite réimprimé le fichier sur la console et l'ai saisi à l'écran. Avant de procéder à la capture d'écran, j'ai dû modifier la couleur de l'avant-plan en noir et celle de l'arrière-plan en blanc, afin d'améliorer l'apparence et d'économiser de l'encre dans un document qui serait imprimé.

Il est très surprenant qu'il n'existe pas de meilleur outil pour cela. Si j'avais le temps, j'écrirais une extension Visio ou peut-être une ligne de commande qui produirait du SVG. Le SVG n'étant pas conforme aux normes HTML5, il permettrait même une inclusion aisée dans la documentation en ligne.

11 votes

Pourquoi cette question est-elle fermée ? Il existe des DSL de programmation pour dessiner des arbres : par exemple, des outils comme Graphviz qui peuvent résoudre ce problème de manière "programmatique".

5 votes

Je vais rouvrir le dossier (provisoirement) parce que si c'était un simple "comment montrer ce qui est à l'écran", il aurait demandé une capture d'écran. S'il veut le dessiner, c'est probablement pour un document de conception ou une présentation, donc il va programmer à un moment donné.

2 votes

Je suis d'accord. J'ai déjà eu besoin de ce même type de fonctionnalité et j'ai dû faire semblant avec Visio. J'en avais besoin pour la documentation de l'UE. C'était certainement lié au code.

128voto

svinto Points 8601

Le copier-coller de la commande arborescente pourrait également vous convenir, ce qui vous donnerait ce qui suit :

C:\Inetpub>tree
Lista över mappar i miljövariabeln PATH för volymen XXXXX
Volymens serienummer är XXXXXXXX XXXX:XXXX
C:.
├───AdminScripts
├───iissamples
├───mailroot
│   ├───Badmail
│   ├───Drop
│   ├───Mailbox
│   ├───Pickup
│   ├───Queue
│   ├───Route
│   └───SortTemp
├───Scripts
└───wwwroot
    ├───aspnet_client
    │   └───system_web
    │       └───1_1_4322
    │           └───_vti_cnf
    ├───images
    ├───_private
    └───_vti_log

C:\Inetpub>

1 votes

Bonne idée, mais s'il y a des fichiers/dossiers avec des lettres accentuées, ils seront dans le jeu de caractères OEM, pas Ansi. Ce n'est probablement pas un problème pour la plupart des utilisateurs (anglophones au moins), bien sûr. Même chose pour les caractères semi-graphiques.

6 votes

Linux dispose également d'une commande "tree" comme celle-ci, que je viens de découvrir après avoir consulté cette question sur Stack Overflow. Merci de m'avoir indiqué le nom que je dois rechercher ! La commande "tree -A" permet de créer l'arbre en utilisant de jolis caractères de dessin ; la commande "tree" ordinaire se limite à l'ASCII.

1 votes

Bien, je ne connaissais même pas cette commande

19voto

joel.neely Points 17059

Graphviz - de la page web :

Les programmes de mise en page Graphviz prennent des descriptions de graphiques dans un langage texte simple, et réalisent des diagrammes dans plusieurs formats utiles tels que des images et SVG pour les pages web, Postscript pour l'inclusion dans des documents PDF ou autres, ou l'affichage dans un navigateur de graphiques interactif. (Graphviz prend également en charge GXL, un dialecte XML).

C'est l'outil le plus simple et le plus productif que j'ai trouvé pour créer une variété de diagrammes de type boîtes et lignes. J'ai et j'utilise Visio et OmniGraffle, mais je suis toujours tenté de faire "juste un ajustement de plus".

Il est également assez facile d'écrire du code pour produire le format "dot file" que Graphiz utilise, de sorte que la production automatisée de diagrammes est également à portée de main.

5voto

PhiLho Points 23458

Comme promis, voici ma version du Caire. Je l'ai scripté avec Lua, en utilisant lfs pour parcourir les répertoires. J'aime ces petits défis, car ils me permettent d'explorer des APIs que je voulais creuser depuis un certain temps...
lfs et LuaCairo sont tous deux multiplateformes, donc cela devrait fonctionner sur d'autres systèmes (testé sur WinXP Pro SP3 français).

J'ai fait une première version en dessinant les noms des fichiers au fur et à mesure que je marchais dans l'arbre. Avantage : pas de surcharge mémoire. Inconvénient : Je dois spécifier la taille de l'image au préalable, donc les listes risquent d'être coupées.

J'ai donc réalisé cette version, en parcourant d'abord l'arbre des répertoires, en le stockant dans une table Lua. Ensuite, connaissant le nombre de fichiers, je crée le canevas pour qu'il s'adapte (au moins verticalement) et je dessine les noms.
Vous pouvez facilement passer du rendu PNG au rendu SVG. Le problème avec ce dernier : Cairo le génère à bas niveau, en dessinant les lettres au lieu d'utiliser la capacité de texte de SVG. Au moins, cela garantit un rendu précis même sur des systèmes sans police. Mais les fichiers sont plus gros... Ce n'est pas vraiment un problème si vous le compressez après, pour avoir un fichier .svgz.
Ou il ne devrait pas être trop difficile de générer le SVG directement, j'ai utilisé Lua pour générer le SVG dans le passé.

-- LuaFileSystem <http://www.keplerproject.org/luafilesystem/>
require"lfs"
-- LuaCairo <http://www.dynaset.org/dogusanh/>
require"lcairo"
local CAIRO = cairo

local PI = math.pi
local TWO_PI = 2 * PI

--~ local dirToList = arg[1] or "C:/PrgCmdLine/Graphviz"
--~ local dirToList = arg[1] or "C:/PrgCmdLine/Tecgraf"
local dirToList = arg[1] or "C:/PrgCmdLine/tcc"
-- Ensure path ends with /
dirToList = string.gsub(dirToList, "([^/])$", "%1/")
print("Listing: " .. dirToList)
local fileNb = 0

--~ outputType = 'svg'
outputType = 'png'

-- dirToList must have a trailing slash
function ListDirectory(dirToList)
  local dirListing = {}
  for file in lfs.dir(dirToList) do
    if file ~= ".." and file ~= "." then
      local fileAttr = lfs.attributes(dirToList .. file)
      if fileAttr.mode == "directory" then
        dirListing[file] = ListDirectory(dirToList .. file .. '/')
      else
        dirListing[file] = ""
      end
      fileNb = fileNb + 1
    end
  end
  return dirListing
end

--dofile[[../Lua/DumpObject.lua]] -- My own dump routine
local dirListing = ListDirectory(dirToList)
--~ print("\n" .. DumpObject(dirListing))
print("Found " .. fileNb .. " files")

--~ os.exit()

-- Constants to change to adjust aspect
local initialOffsetX = 20
local offsetY = 50
local offsetIncrementX = 20
local offsetIncrementY = 12
local iconOffset = 10

local width = 800 -- Still arbitrary
local titleHeight = width/50
local height = offsetIncrementY * (fileNb + 1) + titleHeight
local outfile = "CairoDirTree." .. outputType

local ctxSurface
if outputType == 'svg' then
  ctxSurface = cairo.SvgSurface(outfile, width, height)
else
  ctxSurface = cairo.ImageSurface(CAIRO.FORMAT_RGB24, width, height)
end
local ctx = cairo.Context(ctxSurface)

-- Display a file name
-- file is the file name to display
-- offsetX is the indentation
function DisplayFile(file, bIsDir, offsetX)
  if bIsDir then
    ctx:save()
    ctx:select_font_face("Sans", CAIRO.FONT_SLANT_NORMAL, CAIRO.FONT_WEIGHT_BOLD)
    ctx:set_source_rgb(0.5, 0.0, 0.7)
  end

  -- Display file name
  ctx:move_to(offsetX, offsetY)
  ctx:show_text(file)

  if bIsDir then
    ctx:new_sub_path() -- Position independent of latest move_to
    -- Draw arc with absolute coordinates
    ctx:arc(offsetX - iconOffset, offsetY - offsetIncrementY/3, offsetIncrementY/3, 0, TWO_PI)
    -- Violet disk
    ctx:set_source_rgb(0.7, 0.0, 0.7)
    ctx:fill()
    ctx:restore() -- Restore original settings
  end

  -- Increment line offset
  offsetY = offsetY + offsetIncrementY
end

-- Erase background (white)
ctx:set_source_rgb(1.0, 1.0, 1.0)
ctx:paint()

--~ ctx:set_line_width(0.01)

-- Draw in dark blue
ctx:set_source_rgb(0.0, 0.0, 0.3)
ctx:select_font_face("Sans", CAIRO.FONT_SLANT_NORMAL, CAIRO.FONT_WEIGHT_BOLD)
ctx:set_font_size(titleHeight)
ctx:move_to(5, titleHeight)
-- Display title
ctx:show_text("Directory tree of " .. dirToList)

-- Select font for file names
ctx:select_font_face("Sans", CAIRO.FONT_SLANT_NORMAL, CAIRO.FONT_WEIGHT_NORMAL)
ctx:set_font_size(10)
offsetY = titleHeight * 2

-- Do the job
function DisplayDirectory(dirToList, offsetX)
  for k, v in pairs(dirToList) do
--~ print(k, v)
    if type(v) == "table" then
      -- Sub-directory
      DisplayFile(k, true, offsetX)
      DisplayDirectory(v, offsetX + offsetIncrementX)
    else
      DisplayFile(k, false, offsetX)
    end
  end
end

DisplayDirectory(dirListing, initialOffsetX)

if outputType == 'svg' then
    cairo.show_page(ctx)
else
  --cairo.surface_write_to_png(ctxSurface, outfile)
  ctxSurface:write_to_png(outfile)
end

ctx:destroy()
ctxSurface:destroy()

print("Found " .. fileNb .. " files")

Bien sûr, vous pouvez changer les styles. Je n'ai pas dessiné les lignes de connexion, je ne le voyais pas comme nécessaire. Je pourrais les ajouter optionnellement plus tard.

5voto

paxdiablo Points 341644

Pourquoi ne pas créer une structure de fichiers dans le système de fichiers de Windows et la remplir avec les noms que vous souhaitez, puis utiliser une capture d'écran comme HyperSnap (ou l'omniprésente Alt-PrtScr) pour capturer une section de la fenêtre de l'explorateur.

J'ai fait cela lorsque j'ai fait la "démo" d'une application Internet qui devait avoir des sections pliables, il me suffisait de créer des fichiers qui ressemblaient aux entrées souhaitées.

HyperSnap donne des JPGs au moins (probablement d'autres mais je n'ai jamais pris la peine de chercher).

Vous pourriez aussi faire une capture d'écran des icônes +/- de l'Explorateur et les utiliser dans MS Word Draw lui-même pour faire votre dessin, mais je n'ai jamais réussi à faire en sorte que MS Word Draw se comporte correctement.

2voto

PhiLho Points 23458

Le conseil d'utiliser Graphviz est bon : vous pouvez générer le fichier point et il fera le travail difficile de mesurer les chaînes, de faire la mise en page, etc. De plus, il peut produire les graphiques dans de nombreux formats, y compris des formats vectoriels.

J'ai trouvé un programme Perl faisant précisément cela, dans une liste de diffusion, mais je n'arrive pas à le retrouver ! J'ai copié l'exemple de fichier dot et l'ai étudié, car je ne connais pas beaucoup cette syntaxe déclarative et je voulais en apprendre un peu plus.

Problème : avec la dernière version de Graphviz, j'ai des erreurs (ou plutôt des avertissements, car le diagramme final est généré), tant dans le graphique original que dans celui que j'ai écrit (à la main). Quelques recherches ont montré que cette erreur se trouvait dans les anciennes versions et disparaissait dans les versions plus récentes. On dirait qu'elle est de retour.

Je donne quand même le fichier, peut-être qu'il peut être un point de départ pour quelqu'un, ou peut-être qu'il est suffisant pour vos besoins (bien sûr, vous devez toujours le générer).

digraph tree
{
  rankdir=LR;

  DirTree [label="Directory Tree" shape=box]

  a_Foo_txt [shape=point]
  f_Foo_txt [label="Foo.txt", shape=none]
  a_Foo_txt -> f_Foo_txt

  a_Foo_Bar_html [shape=point]
  f_Foo_Bar_html [label="Foo Bar.html", shape=none]
  a_Foo_Bar_html -> f_Foo_Bar_html

  a_Bar_png [shape=point]
  f_Bar_png [label="Bar.png", shape=none]
  a_Bar_png -> f_Bar_png

  a_Some_Dir [shape=point]
  d_Some_Dir [label="Some Dir", shape=ellipse]
  a_Some_Dir -> d_Some_Dir

  a_VBE_C_reg [shape=point]
  f_VBE_C_reg [label="VBE_C.reg", shape=none]
  a_VBE_C_reg -> f_VBE_C_reg

  a_P_Folder [shape=point]
  d_P_Folder [label="P Folder", shape=ellipse]
  a_P_Folder -> d_P_Folder

  a_Processing_20081117_7z [shape=point]
  f_Processing_20081117_7z [label="Processing-20081117.7z", shape=none]
  a_Processing_20081117_7z -> f_Processing_20081117_7z

  a_UsefulBits_lua [shape=point]
  f_UsefulBits_lua [label="UsefulBits.lua", shape=none]
  a_UsefulBits_lua -> f_UsefulBits_lua

  a_Graphviz [shape=point]
  d_Graphviz [label="Graphviz", shape=ellipse]
  a_Graphviz -> d_Graphviz

  a_Tree_dot [shape=point]
  f_Tree_dot [label="Tree.dot", shape=none]
  a_Tree_dot -> f_Tree_dot

  {
    rank=same;
    DirTree -> a_Foo_txt -> a_Foo_Bar_html -> a_Bar_png -> a_Some_Dir -> a_Graphviz [arrowhead=none]
  }
  {
    rank=same;
    d_Some_Dir -> a_VBE_C_reg -> a_P_Folder -> a_UsefulBits_lua [arrowhead=none]
  }
  {
    rank=same;
    d_P_Folder -> a_Processing_20081117_7z [arrowhead=none]
  }
  {
    rank=same;
    d_Graphviz -> a_Tree_dot [arrowhead=none]
  }
}

> dot -Tpng Tree.dot -o Tree.png
Error: lost DirTree a_Foo_txt edge
Error: lost a_Foo_txt a_Foo_Bar_html edge
Error: lost a_Foo_Bar_html a_Bar_png edge
Error: lost a_Bar_png a_Some_Dir edge
Error: lost a_Some_Dir a_Graphviz edge
Error: lost d_Some_Dir a_VBE_C_reg edge
Error: lost a_VBE_C_reg a_P_Folder edge
Error: lost a_P_Folder a_UsefulBits_lua edge
Error: lost d_P_Folder a_Processing_20081117_7z edge
Error: lost d_Graphviz a_Tree_dot edge

Je vais essayer une autre direction, en utilisant Cairo, qui est également capable d'exporter un certain nombre de formats. C'est plus de travail (calcul des positions/offsets) mais la structure est simple, ça ne devrait pas être trop difficile.

1 votes

Steve DeRose a créé un fichier Perlscript de type file-structure -> dot à l'adresse suivante derose.net/steve/utilities

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X