graphviz.html 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. <?xml version="1.0" encoding="utf-8" ?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  6. <meta name="AppleTitle" content="Graphviz Help" />
  7. <meta name="AppleIcon" content="GraphAttributes.png" />
  8. <meta name="description" content="Graphviz FAQ" />
  9. <meta name="KEYWORDS" content="discard,dispose,delete,clear,erase" />
  10. <meta name="ROBOTS" content="NOINDEX" />
  11. <style type="text/css">
  12. /*
  13. ** HTML elements
  14. */
  15. .comment .links {
  16. margin-bottom: 0;
  17. }
  18. /*
  19. ** Page layout blocks / IDs
  20. */
  21. #header, #content {
  22. width: 100%;
  23. }
  24. #header {
  25. background-color: #69c;
  26. }
  27. .site-name {
  28. color: #fff;
  29. }
  30. .image{
  31. border: 1px solid #69c;
  32. }
  33. .containingbox{
  34. width: 600px;
  35. border: 0px solid #000;
  36. }
  37. </style>
  38. </head>
  39. <body>
  40. <div id="header">
  41. <a href="/" title="Home"><img class="image" src="https://www.graphviz.org/Resources/app.png" alt="Home" /></a><h1 class='site-name'>Graphviz - Graph Visualization Software</h1>
  42. </div>
  43. <h2>Graphviz Help</h2>
  44. <div class="containingbox">
  45. Graph visualization is a way of representing structural information as diagrams of abstract graphs and networks. It has important applications in networking,
  46. bioinformatics, software engineering, database and web design, machine learning, and in visual interfaces for other technical domains.
  47. More information on Graphviz is available here - <a href="https://www.graphviz.org/about/" target="_blank" >About Graphviz</a>
  48. </div>
  49. <P>
  50. <div class="containingbox">
  51. Graphviz.app is a viewer that displays graphs written in the Graphviz dot language.
  52. It is not an editor, so you cannot add or delete nodes or edges, nor can you individually reposition them.
  53. In addition, it is not possible to alter the attributes of any particular node or edge.
  54. <P>
  55. The viewer does permit, however, the setting of various global Graphviz attributes.
  56. This is equivalent to adding a <tt>node</tt> or <tt>edge</tt> statement to the graph.
  57. Such changes will affect any node or edge that does not set the attribute explicitly.
  58. <P>
  59. To set attributes, click on the <b>Attributes</b> button at the top left of the graph window. This will open
  60. a new window, listing all of the known supported attributes and the current global value. Initially, the window
  61. displays graph attributes. By clicking on the circle or the slash at the top of the attribute window, you can
  62. get a list of the default node or edge attributes. Clicking on the leftmost icon with the three connected
  63. circles will take you back to the graph attributes.
  64. <P>
  65. If you click on an attribute, you will see a brief description of its role at the bottom.
  66. To alter an attribute value, simply double click on the value you wish to change. This will open a text
  67. edit window, in which you can enter the desired new value. Pressing the <b>return</b> or <b>tab</b> key
  68. will store the new value, and update the graph drawing to reflect the change.
  69. More information about Graphviz attributes is available here - <a href="https://www.graphviz.org/doc/info/attrs.html" target="_blank" >Node, Edge and Graph Attributes</a>
  70. <H3>Changing the layout</H3>
  71. By default, Graphviz.app uses the <b>dot</b> layout.
  72. To change to a different layout, go to the list of graph attributes and look for the <tt>layout</tt>
  73. attribute. Now change it as you would any other attribute.
  74. For example, to use the <b>neato</b> layout, double click on the <tt>layout</tt>
  75. attribute value, enter <tt>neato</tt>, and then
  76. press <b>return</b>.
  77. </div>
  78. <P>
  79. <div class="containingbox">
  80. Additional help with Graphviz can be found here - <a href="https://www.graphviz.org/faq/" target="_blank" >Graphviz FAQ</a>
  81. </div>
  82. <tr>
  83. <td id="logo">
  84. </td>
  85. </tr>
  86. </body>
  87. </html>