The installation                     How it works                   Conclusions                             Graphviz and T...
The installation                        How it works                   ConclusionsIndex       1     The installation      ...
The installation                            How it works                         ConclusionsIntroduction              Grap...
The installation                        How it works                   ConclusionsOutline       1     The installation    ...
The installation                             How it works                           ConclusionsRequirements for dot2tex   ...
The installation                       How it works                          ConclusionsInstallation of pyparsing      An ...
The installation                       How it works                          ConclusionsInstallation of pyparsing      An ...
The installation                          How it works                          ConclusionsInstallation of Graphviz      O...
The installation                            How it works                  ConclusionsInstallation of dot2tex      There ar...
The installation                            How it works                  ConclusionsInstallation of dot2tex      There ar...
The installation                        How it works                       ConclusionsOutline       1     The installation...
The installation                        How it works                       ConclusionsHow it works - Outline       1     T...
The installation                         How it works                           ConclusionsThe dot code              Creat...
The installation                          How it works                          ConclusionsObtaining the TikZ picture     ...
The installation                              How it works                                 ConclusionsThe result          ...
The installation                              How it works                                 ConclusionsThe result          ...
The installation                              How it works                                 ConclusionsThe result          ...
The installation                              How it works                                 ConclusionsThe result          ...
The installation                              How it works                                 ConclusionsThe result          ...
The installation                              How it works                                 ConclusionsThe result          ...
The installation                              How it works                                 ConclusionsThe result          ...
The installation                        How it works                       ConclusionsHow it works - Outline       1     T...
The installation                         How it works                            ConclusionsThe output options            ...
The installation                         How it works                            ConclusionsThe output options            ...
The installation                         How it works                            ConclusionsThe output options            ...
The installation                             How it works                             ConclusionsWhat are the differences? ...
The installation                        How it works                       ConclusionsHow it works - Outline       1     T...
The installation                        How it works                            ConclusionsThe dot code      In this secon...
The installation                         How it works                            ConclusionsObtaining the TikZ picture    ...
The installation                           How it works                          ConclusionsThe results      Math mode:   ...
The installation                         How it works                              ConclusionsAnother method to put labels...
The installation                        How it works                       ConclusionsHow it works - Outline       1     T...
The installation                              How it works                                  ConclusionsLabel colors       ...
The installation                              How it works                                  ConclusionsLabel colors       ...
The installation                              How it works                                  ConclusionsLabel colors       ...
The installation                              How it works                                  ConclusionsLabel colors       ...
The installation                                    How it works                          ConclusionsOther options        ...
The installation                                    How it works                          ConclusionsOther options        ...
The installation                                    How it works                          ConclusionsOther options        ...
The installation                                    How it works                          ConclusionsOther options        ...
The installation                        How it works                       ConclusionsHow it works - Outline       1     T...
The installation                         How it works                           ConclusionsNode characterization      Node...
The installation                               How it works                             ConclusionsAn example             ...
The installation                               How it works                             ConclusionsAn example             ...
The installation                               How it works                             ConclusionsAn example             ...
The installation                               How it works                             ConclusionsAn example             ...
The installation                               How it works                             ConclusionsAn example             ...
The installation                               How it works                             ConclusionsAn example             ...
The installation                             How it works                             ConclusionsDefining types            ...
The installation                        How it works                                ConclusionsExample with types         ...
The installation                             How it works                              ConclusionsExample with types      ...
The installation                       How it works                           ConclusionsThe result (I)              By us...
The installation                       How it works                           ConclusionsThe result (I)              By us...
The installation                       How it works                           ConclusionsThe result (I)              By us...
The installation                       How it works                           ConclusionsThe result (II)              By u...
The installation                       How it works                           ConclusionsThe result (II)              By u...
The installation                       How it works                           ConclusionsThe result (II)              By u...
The installation                        How it works                          ConclusionsThe result (III)              By ...
The installation                        How it works                          ConclusionsThe result (III)              By ...
The installation                        How it works                          ConclusionsThe result (III)              By ...
The installation                            How it works                       ConclusionsResults motivations             ...
The installation                        How it works                       ConclusionsHow it works - Outline       1     T...
The installation                              How it works                      ConclusionsEdge characterization          ...
The installation                         How it works                               ConclusionsAn example: the code       ...
The installation                      How it works                           ConclusionsAn example: the result            ...
The installation                      How it works                           ConclusionsAn example: the result            ...
The installation                      How it works                           ConclusionsAn example: the result            ...
The installation                            How it works                             ConclusionsConsiderations            ...
The installation                        How it works                                ConclusionsAnother example: the code  ...
The installation                       How it works                           ConclusionsAn example: the result           ...
The installation                       How it works                           ConclusionsAn example: the result           ...
The installation                       How it works                           ConclusionsAn example: the result           ...
The installation                        How it works                       ConclusionsOutline       1     The installation...
The installation                         How it works                         ConclusionsWhy use dot?      Someone can cla...
The installation                      How it works                           ConclusionsWhere is convenient to use TikZ?  ...
The installation                         How it works                              ConclusionsCode of previous example    ...
The installation                         How it works                            ConclusionsComments              The main...
The installation                        How it works                          ConclusionsLicence and Credit      This pres...
Upcoming SlideShare
Loading in...5
×

Graphviz and TikZ

2,055

Published on

How to export a graph realized through Graphviz into a TikZ picture for a LaTeX document.

Published in: Self Improvement, Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,055
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
43
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Graphviz and TikZ

  1. 1. The installation How it works Conclusions Graphviz and TikZ Claudio Fiandrino December 4, 2011 Claudio Fiandrino Graphviz and TikZ December 4, 2011 1 of 51
  2. 2. The installation How it works ConclusionsIndex 1 The installation 2 How it works The first example The output The second example Label property Node property Edge property 3 Conclusions Claudio Fiandrino Graphviz and TikZ December 4, 2011 2 of 51
  3. 3. The installation How it works ConclusionsIntroduction Graphviz is a tool that allows to build graphs In this presentation we analyse how is it possible export a Graphviz result in a TikZ picture thanks to: dot2tex The operating system used is Ubuntu 11.04 Each example contains: the dot code the graphical result obtained by running pdfLTEX A Examples are mainly derived from the web site of dot2tex Claudio Fiandrino Graphviz and TikZ December 4, 2011 3 of 51
  4. 4. The installation How it works ConclusionsOutline 1 The installation 2 How it works The first example The output The second example Label property Node property Edge property 3 Conclusions Claudio Fiandrino Graphviz and TikZ December 4, 2011 4 of 51
  5. 5. The installation How it works ConclusionsRequirements for dot2tex As reported in the dot2tex main page, the following software are required: python, version 2.4 of later pyparsing version 1.4.8 (recommended) or later Graphviz Preview LTEX package A to not have problems I suggest to install TEX Live: this helps if you want to exploit the dot2texi package and, of course, with TikZ/PGF TikZ/PGF in case you have TEX Live you do not need to install anymore Claudio Fiandrino Graphviz and TikZ December 4, 2011 5 of 51
  6. 6. The installation How it works ConclusionsInstallation of pyparsing An easy way to install things is to use easy_install. Easy_Install Open your terminal and do: sudo apt - get install python - setuptools Pyparsing Digit, again in the terminal: sudo easy_install pyparsing Claudio Fiandrino Graphviz and TikZ December 4, 2011 6 of 51
  7. 7. The installation How it works ConclusionsInstallation of pyparsing An easy way to install things is to use easy_install. Easy_Install Open your terminal and do: sudo apt - get install python - setuptools Pyparsing Digit, again in the terminal: sudo easy_install pyparsing Claudio Fiandrino Graphviz and TikZ December 4, 2011 6 of 51
  8. 8. The installation How it works ConclusionsInstallation of Graphviz Open Synaptic, the packet manager, and install the followings: graphviz, graphviz-doc, graphviz-dev, libgraphviz-dev, libgraphviz-perl libgv-lua, libgv-perl, libgv-php5, libgv-guile, libgv-python, libgv-ruby, libgv-tlc, libgv-ocaml Claudio Fiandrino Graphviz and TikZ December 4, 2011 7 of 51
  9. 9. The installation How it works ConclusionsInstallation of dot2tex There are two ways to install it: by means of easy_install by downloading it from the source page from CTAN Through easy_install With the terminal, do: sudo easy_install dot2tex Claudio Fiandrino Graphviz and TikZ December 4, 2011 8 of 51
  10. 10. The installation How it works ConclusionsInstallation of dot2tex There are two ways to install it: by means of easy_install by downloading it from the source page from CTAN From source After having downloaded the .zip file, unpack it, move into the directory and do: sudo python setup . py install Claudio Fiandrino Graphviz and TikZ December 4, 2011 9 of 51
  11. 11. The installation How it works ConclusionsOutline 1 The installation 2 How it works The first example The output The second example Label property Node property Edge property 3 Conclusions Claudio Fiandrino Graphviz and TikZ December 4, 2011 10 of 51
  12. 12. The installation How it works ConclusionsHow it works - Outline 1 The installation 2 How it works The first example The output The second example Label property Node property Edge property 3 Conclusions Claudio Fiandrino Graphviz and TikZ December 4, 2011 11 of 51
  13. 13. The installation How it works ConclusionsThe dot code Create in your desktop a directory named ex1 Create with gedit a new empty file called ex1.dot and paste this code: digraph G { 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 3 - >1 [ l a b e l ="1/2"]; } Claudio Fiandrino Graphviz and TikZ December 4, 2011 12 of 51
  14. 14. The installation How it works ConclusionsObtaining the TikZ picture At this point use the terminal to move into the folder: cd Desktop / ex1 / To create the .tex file use: dot2tex -- preproc ex1 . dot | dot2tex > ex1 . tex To obtain the image, run: pdflatex ex1 . tex Claudio Fiandrino Graphviz and TikZ December 4, 2011 13 of 51
  15. 15. The installation How it works ConclusionsThe result The LTEX document created by running A the dot2tex command is complete 1 it has its own preamble it uses one page just for the picture 1/2 the result is shown on the right Pay attention: the option preproc needs Preview 2 1/2 You can copy the code of the picture into another document, but be aware of insert 1/2 also the tikzlibrary reported in the preamble 3 usepackage { tikz } u s e t i k z l i b r a r y { snakes , arrows , shapes } Claudio Fiandrino Graphviz and TikZ December 4, 2011 14 of 51
  16. 16. The installation How it works ConclusionsThe result The LTEX document created by running A the dot2tex command is complete 1 it has its own preamble it uses one page just for the picture 1/2 the result is shown on the right Pay attention: the option preproc needs Preview 2 1/2 You can copy the code of the picture into another document, but be aware of insert 1/2 also the tikzlibrary reported in the preamble 3 usepackage { tikz } u s e t i k z l i b r a r y { snakes , arrows , shapes } Claudio Fiandrino Graphviz and TikZ December 4, 2011 14 of 51
  17. 17. The installation How it works ConclusionsThe result The LTEX document created by running A the dot2tex command is complete 1 it has its own preamble it uses one page just for the picture 1/2 the result is shown on the right Pay attention: the option preproc needs Preview 2 1/2 You can copy the code of the picture into another document, but be aware of insert 1/2 also the tikzlibrary reported in the preamble 3 usepackage { tikz } u s e t i k z l i b r a r y { snakes , arrows , shapes } Claudio Fiandrino Graphviz and TikZ December 4, 2011 14 of 51
  18. 18. The installation How it works ConclusionsThe result The LTEX document created by running A the dot2tex command is complete 1 it has its own preamble it uses one page just for the picture 1/2 the result is shown on the right Pay attention: the option preproc needs Preview 2 1/2 You can copy the code of the picture into another document, but be aware of insert 1/2 also the tikzlibrary reported in the preamble 3 usepackage { tikz } u s e t i k z l i b r a r y { snakes , arrows , shapes } Claudio Fiandrino Graphviz and TikZ December 4, 2011 14 of 51
  19. 19. The installation How it works ConclusionsThe result The LTEX document created by running A the dot2tex command is complete 1 it has its own preamble it uses one page just for the picture 1/2 the result is shown on the right Pay attention: the option preproc needs Preview 2 1/2 You can copy the code of the picture into another document, but be aware of insert 1/2 also the tikzlibrary reported in the preamble 3 usepackage { tikz } u s e t i k z l i b r a r y { snakes , arrows , shapes } Claudio Fiandrino Graphviz and TikZ December 4, 2011 14 of 51
  20. 20. The installation How it works ConclusionsThe result The LTEX document created by running A the dot2tex command is complete 1 it has its own preamble it uses one page just for the picture 1/2 the result is shown on the right Pay attention: the option preproc needs Preview 2 1/2 You can copy the code of the picture into another document, but be aware of insert 1/2 also the tikzlibrary reported in the preamble 3 usepackage { tikz } u s e t i k z l i b r a r y { snakes , arrows , shapes } Claudio Fiandrino Graphviz and TikZ December 4, 2011 14 of 51
  21. 21. The installation How it works ConclusionsThe result The LTEX document created by running A the dot2tex command is complete 1 it has its own preamble it uses one page just for the picture 1/2 the result is shown on the right Pay attention: the option preproc needs Preview 2 1/2 You can copy the code of the picture into another document, but be aware of insert 1/2 also the tikzlibrary reported in the preamble 3 usepackage { tikz } u s e t i k z l i b r a r y { snakes , arrows , shapes } Claudio Fiandrino Graphviz and TikZ December 4, 2011 14 of 51
  22. 22. The installation How it works ConclusionsHow it works - Outline 1 The installation 2 How it works The first example The output The second example Label property Node property Edge property 3 Conclusions Claudio Fiandrino Graphviz and TikZ December 4, 2011 15 of 51
  23. 23. The installation How it works ConclusionsThe output options If you do not specify nothing, the picture is written in PGF code; the same result is obtained thanks to the option fpgf To have the picture in TikZ code the option that has to be exploited is ftikz The last option is fpst: this force the software to write PSTricks code Example PGF dot2tex - fpgf ex1 . dot > ex1_pgf . tex Claudio Fiandrino Graphviz and TikZ December 4, 2011 16 of 51
  24. 24. The installation How it works ConclusionsThe output options If you do not specify nothing, the picture is written in PGF code; the same result is obtained thanks to the option fpgf To have the picture in TikZ code the option that has to be exploited is ftikz The last option is fpst: this force the software to write PSTricks code Example TikZ dot2tex - ftikz ex1 . dot > ex1_tikz . tex Claudio Fiandrino Graphviz and TikZ December 4, 2011 17 of 51
  25. 25. The installation How it works ConclusionsThe output options If you do not specify nothing, the picture is written in PGF code; the same result is obtained thanks to the option fpgf To have the picture in TikZ code the option that has to be exploited is ftikz The last option is fpst: this force the software to write PSTricks code Example PSTricks dot2tex - fpst ex1 . dot > ex1_pst . tex Claudio Fiandrino Graphviz and TikZ December 4, 2011 18 of 51
  26. 26. The installation How it works ConclusionsWhat are the differences? PSTricks, to the best knowledge of the author, today is not largely used as TikZ/PGF PGF is much more machine-friendly more lines of code are necessary than TikZ TikZ is user-friendly the suggestion is to use it if you want successively modify the picture Claudio Fiandrino Graphviz and TikZ December 4, 2011 19 of 51
  27. 27. The installation How it works ConclusionsHow it works - Outline 1 The installation 2 How it works The first example The output The second example Label property Node property Edge property 3 Conclusions Claudio Fiandrino Graphviz and TikZ December 4, 2011 20 of 51
  28. 28. The installation How it works ConclusionsThe dot code In this second example, we introduce labels also into nodes. Create in your desktop a directory named ex2 Create with gedit a new empty file called ex2.dot and paste this code: digraph G { a_1 - > b_2 [ l a b e l ="1/2"]; b_2 - > c_3 [ l a b e l ="1/2"]; c_3 - > a_1 [ l a b e l ="1/2"]; } Claudio Fiandrino Graphviz and TikZ December 4, 2011 21 of 51
  29. 29. The installation How it works ConclusionsObtaining the TikZ picture In this frame are reported three ways to obtain the picture: in math mode, the label will be put into $ $: useful to represent the usual math relations of LTEX A dot2tex -tmath ex2 . dot > ex2 . tex in verbatim mode, the label will not show special LTEX A characters dot2tex -tverbatim ex2 . dot > ex2 . tex in raw mode, the label will not be processed at all dot2tex -traw ex2 . dot > ex2 . tex Claudio Fiandrino Graphviz and TikZ December 4, 2011 22 of 51
  30. 30. The installation How it works ConclusionsThe results Math mode: Verbatim mode: Raw mode: by running pdflatex you obtain an error: a1 a_1 this is due to the fact that in LTEX A 1/2 1/2 the _ character is a special character and, to be repre- b2 1/2 b_2 1/2 sented needs _ 1/2 1/2 c3 c_3 Claudio Fiandrino Graphviz and TikZ December 4, 2011 23 of 51
  31. 31. The installation How it works ConclusionsAnother method to put labels It is possible introduce labels In this case, you just need: for nodes also into the dot code: dot2tex ex2 . dot > ex2 . tex digraph G { The mode can be omitted 1 [ t e x l b l =" $a_1$ "]; 2 [ t e x l b l =" $b_2$ "]; because is assumed to be given 3 [ t e x l b l =" $c_3$ "]; inside the texlbl. 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 3 - >1 [ l a b e l ="1/2"]; } Claudio Fiandrino Graphviz and TikZ December 4, 2011 24 of 51
  32. 32. The installation How it works ConclusionsHow it works - Outline 1 The installation 2 How it works The first example The output The second example Label property Node property Edge property 3 Conclusions Claudio Fiandrino Graphviz and TikZ December 4, 2011 25 of 51
  33. 33. The installation How it works ConclusionsLabel colors To insert a colored label, use: The result is: digraph G { a1 1 [ t e x l b l =" $a_1$ " , l b l s t y l e =" red "]; 2 [ t e x l b l =" $b_2$ "]; 3 [ t e x l b l =" $c_3$ "]; 1/2 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 3 - >1 [ l a b e l ="1/2"]; b2 1/2 } 1/2 c3 Claudio Fiandrino Graphviz and TikZ December 4, 2011 26 of 51
  34. 34. The installation How it works ConclusionsLabel colors To insert a colored label, use: The result is: digraph G { a1 1 [ t e x l b l =" $a_1$ " , l b l s t y l e =" red "]; 2 [ t e x l b l =" $b_2$ "]; 3 [ t e x l b l =" $c_3$ "]; 1/2 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 3 - >1 [ l a b e l ="1/2"]; b2 1/2 } 1/2 c3 Claudio Fiandrino Graphviz and TikZ December 4, 2011 26 of 51
  35. 35. The installation How it works ConclusionsLabel colors To insert a colored label, use: The result is: digraph G { a1 1 [ t e x l b l =" $a_1$ " , l b l s t y l e =" red "]; 2 [ t e x l b l =" $b_2$ "]; 3 [ t e x l b l =" $c_3$ "]; 1/2 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 3 - >1 [ l a b e l ="1/2"]; b2 1/2 } 1/2 c3 Claudio Fiandrino Graphviz and TikZ December 4, 2011 26 of 51
  36. 36. The installation How it works ConclusionsLabel colors To insert a colored label, use: The result is: digraph G { a1 1 [ t e x l b l =" $a_1$ " , l b l s t y l e =" red "]; 2 [ t e x l b l =" $b_2$ "]; 3 [ t e x l b l =" $c_3$ "]; 1/2 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 3 - >1 [ l a b e l ="1/2"]; b2 1/2 } 1/2 c3 Claudio Fiandrino Graphviz and TikZ December 4, 2011 26 of 51
  37. 37. The installation How it works ConclusionsOther options In general, into the lblstyle it is possible The result is: to introduce standard statements of Tikz: a1 digraph G { 1 [ t e x l b l =" $a_1$ " , l b l s t y l e =" red "]; 2 [ t e x l b l =" $b_2$ " , l b l s t y l e =" red "]; 1/2 3 [ t e x l b l =" $c_3$ " , l b l s t y l e =" red "]; 1 - >2 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , b2 fill = blue !20 , rotate =30"]; 1/2 2 - >3 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , fill = blue !20"]; 1/2 3 - >1 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , fill = blue !20 , below =0.1 cm "]; c3 } Claudio Fiandrino Graphviz and TikZ December 4, 2011 27 of 51
  38. 38. The installation How it works ConclusionsOther options In general, into the lblstyle it is possible The result is: to introduce standard statements of Tikz: a1 digraph G { 1 [ t e x l b l =" $a_1$ " , l b l s t y l e =" red "]; 2 [ t e x l b l =" $b_2$ " , l b l s t y l e =" red "]; 1/2 3 [ t e x l b l =" $c_3$ " , l b l s t y l e =" red "]; 1 - >2 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , b2 fill = blue !20 , rotate =30"]; 1/2 2 - >3 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , fill = blue !20"]; 1/2 3 - >1 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , fill = blue !20 , below =0.1 cm "]; c3 } Claudio Fiandrino Graphviz and TikZ December 4, 2011 27 of 51
  39. 39. The installation How it works ConclusionsOther options In general, into the lblstyle it is possible The result is: to introduce standard statements of Tikz: a1 digraph G { 1 [ t e x l b l =" $a_1$ " , l b l s t y l e =" red "]; 2 [ t e x l b l =" $b_2$ " , l b l s t y l e =" red "]; 1/2 3 [ t e x l b l =" $c_3$ " , l b l s t y l e =" red "]; 1 - >2 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , b2 fill = blue !20 , rotate =30"]; 1/2 2 - >3 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , fill = blue !20"]; 1/2 3 - >1 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , fill = blue !20 , below =0.1 cm "]; c3 } Claudio Fiandrino Graphviz and TikZ December 4, 2011 27 of 51
  40. 40. The installation How it works ConclusionsOther options In general, into the lblstyle it is possible The result is: to introduce standard statements of Tikz: a1 digraph G { 1 [ t e x l b l =" $a_1$ " , l b l s t y l e =" red "]; 2 [ t e x l b l =" $b_2$ " , l b l s t y l e =" red "]; 1/2 3 [ t e x l b l =" $c_3$ " , l b l s t y l e =" red "]; 1 - >2 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , b2 fill = blue !20 , rotate =30"]; 1/2 2 - >3 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , fill = blue !20"]; 1/2 3 - >1 [ l a b e l ="1/2" , l b l s t y l e =" rounded corners , fill = blue !20 , below =0.1 cm "]; c3 } Claudio Fiandrino Graphviz and TikZ December 4, 2011 27 of 51
  41. 41. The installation How it works ConclusionsHow it works - Outline 1 The installation 2 How it works The first example The output The second example Label property Node property Edge property 3 Conclusions Claudio Fiandrino Graphviz and TikZ December 4, 2011 28 of 51
  42. 42. The installation How it works ConclusionsNode characterization Nodes may have different: shapes ellipse circle rectangle colours border color fill color fonts There are two ways to characterize nodes: global definition (useful to characterize the majority of nodes) single definition Claudio Fiandrino Graphviz and TikZ December 4, 2011 29 of 51
  43. 43. The installation How it works ConclusionsAn example Through the keyword style, nodes are the result is: customized with the usual statements of 1 Tikz: digraph G { 1/2 node [ s t y l e =" fill = green !20"]; 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 2 1/2 3 - >1 [ l a b e l ="1/2"]; 3 [ shape = rectangle , s t y l e =" fill = cyan !20 , draw = blue "] } 1/2 By using: 3 dot2tex - ftikz ex3 . dot > ex3 . tex Claudio Fiandrino Graphviz and TikZ December 4, 2011 30 of 51
  44. 44. The installation How it works ConclusionsAn example Through the keyword style, nodes are the result is: customized with the usual statements of 1 Tikz: digraph G { 1/2 node [ s t y l e =" fill = green !20"]; 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 2 1/2 3 - >1 [ l a b e l ="1/2"]; 3 [ shape = rectangle , s t y l e =" fill = cyan !20 , draw = blue "] } 1/2 By using: 3 dot2tex - ftikz ex3 . dot > ex3 . tex Claudio Fiandrino Graphviz and TikZ December 4, 2011 30 of 51
  45. 45. The installation How it works ConclusionsAn example Through the keyword style, nodes are the result is: customized with the usual statements of 1 Tikz: digraph G { 1/2 node [ s t y l e =" fill = green !20"]; 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 2 1/2 3 - >1 [ l a b e l ="1/2"]; 3 [ shape = rectangle , s t y l e =" fill = cyan !20 , draw = blue "] } 1/2 By using: 3 dot2tex - ftikz ex3 . dot > ex3 . tex Claudio Fiandrino Graphviz and TikZ December 4, 2011 30 of 51
  46. 46. The installation How it works ConclusionsAn example The same code: gives this result: digraph G { 1 node [ s t y l e =" fill = green !20"]; 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 1/2 3 - >1 [ l a b e l ="1/2"]; 3 [ shape = rectangle , s t y l e =" fill = cyan !20 , draw = blue "] } 2 1/2 By using the default processing (pgf): 1/2 dot2tex ex3 . dot > ex3_pgf . tex 3 Claudio Fiandrino Graphviz and TikZ December 4, 2011 31 of 51
  47. 47. The installation How it works ConclusionsAn example The same code: gives this result: digraph G { 1 node [ s t y l e =" fill = green !20"]; 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 1/2 3 - >1 [ l a b e l ="1/2"]; 3 [ shape = rectangle , s t y l e =" fill = cyan !20 , draw = blue "] } 2 1/2 By using the default processing (pgf): 1/2 dot2tex ex3 . dot > ex3_pgf . tex 3 Claudio Fiandrino Graphviz and TikZ December 4, 2011 31 of 51
  48. 48. The installation How it works ConclusionsAn example The same code: gives this result: digraph G { 1 node [ s t y l e =" fill = green !20"]; 1 - >2 [ l a b e l ="1/2"]; 2 - >3 [ l a b e l ="1/2"]; 1/2 3 - >1 [ l a b e l ="1/2"]; 3 [ shape = rectangle , s t y l e =" fill = cyan !20 , draw = blue "] } 2 1/2 By using the default processing (pgf): 1/2 dot2tex ex3 . dot > ex3_pgf . tex 3 Claudio Fiandrino Graphviz and TikZ December 4, 2011 31 of 51
  49. 49. The installation How it works ConclusionsDefining types In TikZ, it is possible to define types for nodes use the d2tfigpreamble at the beginning of the dot file In the online documentation is not reported the case of plural definition for the best knowledge of the author this feature is fundamental the next example highlight this fact Claudio Fiandrino Graphviz and TikZ December 4, 2011 32 of 51
  50. 50. The installation How it works ConclusionsExample with types This graph will have two types of nodes coloured differently digraph G { d2tfigpreamble = " tikzstyle { statecold }= [ draw = blue !50 , very thick , fill = blue !20] , tikzstyle { statehot }= [ draw = red !50 , very thick , fill = red !20]"; A [ s t y l e =" statecold "]; B [ s t y l e =" statecold "]; C [ s t y l e =" statehot "]; D [ s t y l e =" statehot "]; A - >B - > D ; A - >C - > D ; D->C; D - >B - > A ; B - > B [topath =" loop left "]; C->B; } Claudio Fiandrino Graphviz and TikZ December 4, 2011 33 of 51
  51. 51. The installation How it works ConclusionsExample with types Please note the syntax: inside " " the entire definition is reported (both two states in this case) you have to put a both in front of tikzstyle and before the definition of the type (into [ ]): this is fundamental! you have to separate types with a , The option topaths will be subsequently treated Claudio Fiandrino Graphviz and TikZ December 4, 2011 34 of 51
  52. 52. The installation How it works ConclusionsThe result (I) By using: circo - Txdot ex4 . dot | dot2tex - ftikz > ex4 . tex pdflatex ex4 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 35 of 51
  53. 53. The installation How it works ConclusionsThe result (I) By using: circo - Txdot ex4 . dot | dot2tex - ftikz > ex4 . tex pdflatex ex4 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 35 of 51
  54. 54. The installation How it works ConclusionsThe result (I) By using: circo - Txdot ex4 . dot | dot2tex - ftikz > ex4 . tex pdflatex ex4 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 35 of 51
  55. 55. The installation How it works ConclusionsThe result (II) By using: circo - Txdot ex4 . dot | dot2tex - ftikz -- styleonly > ex4 . tex pdflatex ex4 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 36 of 51
  56. 56. The installation How it works ConclusionsThe result (II) By using: circo - Txdot ex4 . dot | dot2tex - ftikz -- styleonly > ex4 . tex pdflatex ex4 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 36 of 51
  57. 57. The installation How it works ConclusionsThe result (II) By using: circo - Txdot ex4 . dot | dot2tex - ftikz -- styleonly > ex4 . tex pdflatex ex4 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 36 of 51
  58. 58. The installation How it works ConclusionsThe result (III) By using: neato - Txdot ex4 . dot | dot2tex - ftikz -- styleonly > ex4 . tex pdflatex ex4 . tex we obtain: D B A C Claudio Fiandrino Graphviz and TikZ December 4, 2011 37 of 51
  59. 59. The installation How it works ConclusionsThe result (III) By using: neato - Txdot ex4 . dot | dot2tex - ftikz -- styleonly > ex4 . tex pdflatex ex4 . tex we obtain: D B A C Claudio Fiandrino Graphviz and TikZ December 4, 2011 37 of 51
  60. 60. The installation How it works ConclusionsThe result (III) By using: neato - Txdot ex4 . dot | dot2tex - ftikz -- styleonly > ex4 . tex pdflatex ex4 . tex we obtain: D B A C Claudio Fiandrino Graphviz and TikZ December 4, 2011 37 of 51
  61. 61. The installation How it works ConclusionsResults motivations By processing the dot file through circo or neato allows to obtain different kind of results the difference is the layout output circo is preferable with regular topologies Claudio Fiandrino Graphviz and TikZ December 4, 2011 38 of 51
  62. 62. The installation How it works ConclusionsHow it works - Outline 1 The installation 2 How it works The first example The output The second example Label property Node property Edge property 3 Conclusions Claudio Fiandrino Graphviz and TikZ December 4, 2011 39 of 51
  63. 63. The installation How it works ConclusionsEdge characterization Also edges can be characterized: though the dot syntax: edge [ s t y l e ="..."]; by means of the option topath: a -> b [ topath ="..."]; with this options, the usual statements of TikZ can be used Claudio Fiandrino Graphviz and TikZ December 4, 2011 40 of 51
  64. 64. The installation How it works ConclusionsAn example: the code In this example we exploit the first option: digraph G { d2tfigpreamble = " tikzstyle { statecold }= [ draw = blue !50 , very thick , fill = blue !20] , tikzstyle { statehot }= [ draw = red !50 , very thick , fill = red !20]"; A [ s t y l e =" statecold "]; B [ s t y l e =" statecold "]; C [ s t y l e =" statehot "]; D [ s t y l e =" statehot "]; edge [ s t y l e =" snake = zigzag "]; A - >B - >D - >C - > A ; edge [ s t y l e =" snake = snake "]; A->D; C->B; } Claudio Fiandrino Graphviz and TikZ December 4, 2011 41 of 51
  65. 65. The installation How it works ConclusionsAn example: the result By using: circo - Txdot ex5 . dot | dot2tex - ftikz -s > ex5 . tex pdflatex ex5 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 42 of 51
  66. 66. The installation How it works ConclusionsAn example: the result By using: circo - Txdot ex5 . dot | dot2tex - ftikz -s > ex5 . tex pdflatex ex5 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 42 of 51
  67. 67. The installation How it works ConclusionsAn example: the result By using: circo - Txdot ex5 . dot | dot2tex - ftikz -s > ex5 . tex pdflatex ex5 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 42 of 51
  68. 68. The installation How it works ConclusionsConsiderations The -s option is needed to manage snakes The tikzlibrary snakes is now deprecated: although the package requires it, should be better exploit the library decorations would be interesting because decorations allows to exploit pre/post length options and other shapes It is possible of course change later the library, but you are forced also to insert manually the new options in the TikZ code Claudio Fiandrino Graphviz and TikZ December 4, 2011 43 of 51
  69. 69. The installation How it works ConclusionsAnother example: the code In this example we exploit the topath option: digraph G { d2tfigpreamble = " tikzstyle { statecold }= [ draw = blue !50 , very thick , fill = blue !20] , tikzstyle { statehot }= [ draw = red !50 , very thick , fill = red !20]"; A [ s t y l e =" statecold "]; B [ s t y l e =" statecold "]; C [ s t y l e =" statehot "]; D [ s t y l e =" statehot "]; A - >B - >D - >C - > A [topath =" bend left =20"]; A - >C - >D - >B - > A [topath =" bend left =20"]; B - > B [topath =" loop left "]; } Claudio Fiandrino Graphviz and TikZ December 4, 2011 44 of 51
  70. 70. The installation How it works ConclusionsAn example: the result By using: circo - Txdot ex6 . dot | dot2tex - ftikz > ex6 . tex pdflatex ex6 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 45 of 51
  71. 71. The installation How it works ConclusionsAn example: the result By using: circo - Txdot ex6 . dot | dot2tex - ftikz > ex6 . tex pdflatex ex6 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 45 of 51
  72. 72. The installation How it works ConclusionsAn example: the result By using: circo - Txdot ex6 . dot | dot2tex - ftikz > ex6 . tex pdflatex ex6 . tex we obtain: D B C A Claudio Fiandrino Graphviz and TikZ December 4, 2011 45 of 51
  73. 73. The installation How it works ConclusionsOutline 1 The installation 2 How it works The first example The output The second example Label property Node property Edge property 3 Conclusions Claudio Fiandrino Graphviz and TikZ December 4, 2011 46 of 51
  74. 74. The installation How it works ConclusionsWhy use dot? Someone can claim: why use dot and not directly TikZ? The dot language is much more intuitively You can achieve more or less the same quality of TikZ It is more suitable for very large graphs Claudio Fiandrino Graphviz and TikZ December 4, 2011 47 of 51
  75. 75. The installation How it works ConclusionsWhere is convenient to use TikZ? I think that if you just have to insert a small graph in a document and it has to be created from scratch, the best way to do it is use directly TikZ. For example: 1/3 2 1 0 1 3 2 1/2 which has been created thanks to the code reported in the following slide. Claudio Fiandrino Graphviz and TikZ December 4, 2011 48 of 51
  76. 76. The installation How it works ConclusionsCode of previous example begin { lstlisting } begin { tikzpicture } [ - latex , auto ,node distance =4 cm , on grid , semithick , state /. s t y l e ={ circle , top color = white , bottom color = processblue !20 , draw , processblue , circular drop shadow , text = blue , minimum width =1 cm }] node[ state ] ( A ) { $0$ }; node[ state ] ( B ) [ right = of A ] { $1$ }; path ( A ) edge [ loop left ] node{ $ dfrac {2}{3} $ } ( A ); path ( B ) edge [ loop right ] node{ $ dfrac {1}{2} $ } ( B ); path ( B ) edge [ bend left =25] node[ below ]{ $1 /2 $ } ( A ); path ( A ) edge [ bend right = -25 ] node[ above ]{ $1 /3 $ } ( B ); end{ tikzpicture } Claudio Fiandrino Graphviz and TikZ December 4, 2011 49 of 51
  77. 77. The installation How it works ConclusionsComments The main concept is the definition of the state: this is similar to the procedure used through the option d2tfigpreamble The nodes must be placed in some sense (the position of B is given in terms of A’s position): in dot this step is completely avoided The syntax to connect nodes is a bit more heavy than dot Claudio Fiandrino Graphviz and TikZ December 4, 2011 50 of 51
  78. 78. The installation How it works ConclusionsLicence and Credit This presentation: is licensed (CC BY-NC-ND 3.0) has been realized through Arkyenell Theme licensed (CC BY-NC-SA 3.0) Claudio Fiandrino Graphviz and TikZ December 4, 2011 51 of 51
  1. Gostou de algum slide específico?

    Recortar slides é uma maneira fácil de colecionar informações para acessar mais tarde.

×