Vektorgrafikus ábrák készítése L A TEX-ben

Vektorgrafikus ábrák készítése L A TEX-ben TÁMOP 4.1.2.A/1-11/0064 - képzők képzése Tóth László tothl@math.bme.hu 2013. február 4. Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 1 / 54

1 Pixelgrafika és vektorgrafika 2 Egyszerű L A TEX rajz lépésről-lépésre 3 A picture környezet elemeinek használata 4 Példák tanagyagillusztráló ábrákra 5 Ajánlott irodalom Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 2 / 54

Raszteres és vektoros képek Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 4 / 54

Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 5 / 54

Példák raszteres képekre Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 7 / 54

Példák vektoros képekre Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 12 / 54

<?xml version="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/ Graphics/SVG/1.1/DTD/svg11.dtd"> <svg width="4cm" height="4cm" viewbox="0 0 400 400" version="1.1"> <title>sample Triangle</title> <desc>a path that draws a triangle</desc> <rect x="1" y="1" width="398" height="398" fill="none" stroke="blue" /> <path d="m 100 100 L 300 100 L 200 300 z" fill="red" stroke="blue" stroke-width="3" /> </svg> Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 16 / 54

<?xml version="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/graphics/svg/1.1/dtd/svg11.dtd"> <svg width="5cm" height="4cm" viewbox="0 0 500 400" xmlns="http://www.w3.org/2000/svg" version="1.1"> <title>cubic BĂŠzier commands in path data</title> <desc>picture showing a simple example of path data using both a "C" and an "S" command</desc> <style type="text/css"><![cdata[.border{ fill:none; stroke:blue; stroke-width:1 }.Connect{ fill:none; stroke:#888888; stroke-width:2 }.SamplePath{ fill:none; stroke:red; stroke-width:5 }.EndPoint{ fill:none; stroke:#888888; stroke-width:2 }.CtlPoint{ fill:#888888; stroke:none }.AutoCtlPoint{ fill:none; stroke:blue; stroke-width:4 }.Label{ font-size:22; font-family:verdana } ]]> </style> <rect class="border" x="1" y="1" width="498" height="398"/> <polyline class="connect" points="100,200 100,100" /> Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 17 / 54

<polyline class="connect" points="250,100 250,200" /> <polyline class="connect" points="250,200 250,300" /> <polyline class="connect" points="400,300 400,200" /> <path class="samplepath" d="m100,200 C100,100 250,100 250,200 S400,300 400,200" /> <circle class="endpoint" cx="100" cy="200" r="10" /> <circle class="endpoint" cx="250" cy="200" r="10" /> <circle class="endpoint" cx="400" cy="200" r="10" /> <circle class="ctlpoint" cx="100" cy="100" r="10" /> <circle class="ctlpoint" cx="250" cy="100" r="10" /> <circle class="ctlpoint" cx="400" cy="300" r="10" /> <circle class="autoctlpoint" cx="250" cy="300" r="9"/> <text class="label" x="25" y="70">m100,200 C100,100 250,100 250,200</text> <text class="label" x="325" y="350" style="text-anchor:middle">s400,300 400,200</text> </svg> Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 18 / 54

Vektorgrafika előnyei Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 18 / 54

Vektorgrafika hátrányai Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 22 / 54

Raszteres megjelenítés Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 23 / 54

A kétféle megközelítés kombinációja Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 24 / 54

\setlength{\unitlength}{1mm} \begin{picture}(45,45)(-5,-5) \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 27 / 54

\setlength{\unitlength}{1mm} \begin{picture}(45,45)(-5,-5) \thicklines \put(-5,0){\vector(1,0){30}} \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 28 / 54

\setlength{\unitlength}{1mm} \begin{picture}(45,45)(-5,-5) \thicklines \put(-5,0){\vector(1,0){30}} \put(0,-5){\vector(0,1){35}} \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 29 / 54

\setlength{\unitlength}{1mm} \begin{picture}(45,45)(-5,-5) \thicklines \put(-5,0){\vector(1,0){30}} \put(0,-5){\vector(0,1){35}} \put(0,0){\line(4,5){24}} \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 30 / 54

\setlength{\unitlength}{1mm} \begin{picture}(45,45)(-5,-5) \thicklines \put(-5,0){\vector(1,0){30}} \put(0,-5){\vector(0,1){35}} \put(0,0){\line(4,5){24}} \put(20,25){\circle*{1}} \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 31 / 54

\setlength{\unitlength}{1mm} \begin{picture}(45,45)(-5,-5) \thicklines \put(-5,0){\vector(1,0){30}} \put(0,-5){\vector(0,1){35}} \put(0,0){\line(4,5){24}} \put(20,25){\circle*{1}} \thinlines \multiput(2.5,-1)(2.5,0){8}{\line(0,1){2}} \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 32 / 54

\setlength{\unitlength}{1mm} \begin{picture}(45,45)(-5,-5) \thicklines \put(-5,0){\vector(1,0){30}} \put(0,-5){\vector(0,1){35}} \put(0,0){\line(4,5){24}} \put(20,25){\circle*{1}} \thinlines \multiput(2.5,-1)(2.5,0){8}{\line(0,1){2}} \multiput(-1,2.5)(0,2.5){10}{\line(1,0){2}} \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 33 / 54

\setlength{\unitlength}{1mm} \begin{picture}(45,45)(-5,-5) \thicklines \put(-5,0){\vector(1,0){30}} \put(0,-5){\vector(0,1){35}} \put(0,0){\line(4,5){24}} \put(20,25){\circle*{1}} \thinlines \multiput(2.5,-1)(2.5,0){8}{\line(0,1){2}} \multiput(-1,2.5)(0,2.5){10}{\line(1,0){2}} \put(25,-4){$x$} \put(-6,27){$y$} \end{picture} y x Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 34 / 54

\setlength{\unitlength}{0.75mm} \begin{picture}(70,60) \put(40,20){\vector(1,0){30}} \put(40,20){\vector(4,1){20}} \put(40,20){\vector(3,1){25}} \put(40,20){\vector(2,1){30}} \put(40,20){\vector(1,2){10}} \thicklines \put(40,20){\vector(-4,1){30}} \put(40,20){\vector(-1,4){5}} \thinlines \put(40,20){\vector(-1,-1){5}} \put(40,20){\vector(-1,-4){5}} \end{picture} 2 Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 37 / 54

\setlength{\unitlength}{1mm} \begin{picture}(60, 60) \put(30,30){\circle{1}} \put(30,30){\circle{2}} \put(30,30){\circle{4}} \put(30,30){\circle{8}} \put(30,30){\circle{16}} \put(35,10){\circle*{5}} \put(15,10){\circle*{1}} \put(20,10){\circle*{2}} \put(25,10){\circle*{3}} \put(30,10){\circle*{4}} \put(35,10){\circle*{5}} \put(35,10){\circle*{6}} \end{picture} 1 3 67 Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 38 / 54

\setlength{\unitlength}{2mm} \begin{picture}(30,30) \linethickness{0.075mm} \multiput(0,0)(1,0){26}% {\line(0,1){20}} \multiput(0,0)(0,1){21}% {\line(1,0){25}} \linethickness{0.15mm} \multiput(0,0)(5,0){6}% {\line(0,1){20}} \multiput(0,0)(0,5){5}% {\line(1,0){25}} \linethickness{0.3mm} \multiput(5,0)(10,0){2}% {\line(0,1){20}} \multiput(0,5)(0,10){2}% {\line(1,0){25}} \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 39 / 54

\setlength{\unitlength}{7mm} \begin{picture}(10,10)(-5,-5) \linethickness{1pt} \put(-2.5,0){\vector(1,0){5}} \put(0,-2.5){\vector(0,1){5}} \put(0,0){\circle{3}} \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 40 / 54

\setlength{\unitlength}{.4in} \begin{picture}(7,5)(-1.5,-2) \linethickness{1pt} \put(0,0){\line(1,0){4}} \put(4,0){\line(0,1){3}} \put(0,0){\line(4,3){4}} \put(2,-.25){\makebox(0,0){$\alpha$}} \put(4.25,1.5){\makebox(0,0){$\beta$}} \put(2,2){\makebox(0,0){$\gamma$}} \end{picture} γ β α Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 41 / 54

\setlength{\unitlength}{0.75cm} \begin{picture}(6,7) \linethickness{0.075mm} \multiput(0,0)(1,0){7}% {\line(0,1){4}} \multiput(0,0)(0,1){5}% {\line(1,0){6}} \thicklines \put(2,3){\oval(3,1.8)} \put(2,1){\oval(3,1.8)[tl]} \put(4,1){\oval(3,1.8)[b]} \put(4,3){\oval(3,1.8)[r]} \put(3,1.5){\oval(1.8,0.4)} \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 42 / 54

\setlength{\unitlength}{0.5mm} \begin{picture}(40,60) \multiput(0,0)(0,28){2} {\line(1,0){40}} \multiput(0,0)(40,0){2} {\line(0,1){28}} \put(1,28){\oval(2,2)[tl]} \put(1,29){\line(1,0){5}} \put(9,29){\oval(6,6)[tl]} \put(9,32){\line(1,0){8}} \put(17,29){\oval(6,6)[tr]} \put(20,29){\line(1,0){19}} \put(39,28){\oval(2,2)[tr]} \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 43 / 54

\setlength{\unitlength}{0.8cm} \begin{picture}(6,5)(-1,0) \linethickness{0.075mm} \multiput(0,0)(1,0){7} {\line(0,1){4}} \multiput(0,0)(0,1){5} {\line(1,0){6}} \thicklines \put(0.5,0.5){\line(1,5){0.5}} \put(1,3){\line(4,1){2}} \qbezier(0.5,0.5)(1,3)(3,3.5) \thinlines \put(2.5,2){\line(2,-1){3}} \put(5.5,0.5){\line(-1,5){0.5}} \linethickness{1mm} \qbezier(2.5,2)(5.5,0.5)(5,3) \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 44 / 54

\begin{picture}(6, 4) \put(0, 0){\line(6, 1){6}} \put(6, 1){\line(-4, 3){4}} \put(2, 4){\line(-1, -2){2}} \qbezier(0.5367, 1.0733) (1.0832, 0.8) (1.1837, 0.1973) \qbezier(4.8163, 0.8027) (4.7319, 1.3092) (5.04, 1.72) \qbezier(2.96, 3.28) (2.3591, 2.4788) (1.4633, 2.9267) \end{picture} Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 45 / 54

\setlength{\unitlength}{0.8cm} \begin{picture}(6,7) \thicklines \put(1,0.5){\line(2,1){3}} \put(4,2){\line(-2,1){2}} \put(2,3){\line(-2,-5){1}} \put(0.7,0.3){$a$} \put(4.05,1.9){$b$} \put(1.7,2.95){$c$} \put(3.1,2.5){$a$} \put(1.1,1.7){$b$} \put(2.5,1.05){$c$} \put(0.3,4){$f= \sqrt{s(s-a)(s-b)(s-c)}$} \put(3.5,0.4){$\displaystyle s:=\frac{a+b+c}{2}$} \end{picture} F = s(s a)(s b)(s c) C a b B A c s := a + b + c 2 Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 47 / 54

\setlength{\unitlength}{.012in}%{.025in} \begin{picture}(200,175) \put(0,25){\vector(1,0){200}} \put(25,0){\vector(0,1){75}} \put(75,22){\line(0,1){6}} \put(125,22){\line(0,1){6}} \put(22,50){\line(1,0){6}} \thicklines \put(25,25){\line(1,0){50}} \put(75,50){\line(1,0){50}} \put(125,25){\line(1,0){72}} \put(17,50){\makebox(0,0){$1$}} \put(75,13){\makebox(0,0)[b]{$\pi$}} \put(125,13){\makebox(0,0)[b]{$2\pi$}} \put(195,13){\makebox(0,0)[b]{$t$}} \put(175,60){\makebox(0,0){$g(t)$}} \end{picture} 1 g(t) π 2π t Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 48 / 54

\setlength{\unitlength}{1mm} \begin{picture}(50,50)(-5,0) \put(0,29){$a$} \put(5,30){\line(1,0){20}} \put(28,30){\circle*{2}} \put(28,30){\vector(0,-1){10}} \put(30,29){masse f\"allt aus} \put(30,25){ruhelage} \put(0, 9){$B$} \put(5,10){\line(1,0){20}} \put(0,5){\line(1,0){40}} \multiput(1,5)(1,0){40} {\line(-2,-5){2}} \put(15,10){\line(0,1){20}} \put(16,19){$h$} \end{picture} A B h Masse fällt aus Ruhelage Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 49 / 54

\setlength{\unitlength}{1mm} \begin{picture}(93,46)(5,0) \put(0,14){\vector(1,0){60}} \put(61,13){$x$} \put(20,4){\vector(0,1){37}} \put(19,43){$y$} \put(50,34){\circle*{2}} \put(52,35){$p$} \multiput(20,34)(4,0){8}{\line(1,0){2}} \put(14.5,33.5){$y_p$} \multiput(50,14)(0,4){5}{\line(0,1){2}} \put(48,11){$x_p$} \put( 2,8){\vector(3,1){56}} \put(59,26.5){$x $}\put(52,22){$x_p $} \multiput(50,34)(1.9,-5.7){2}{\line(1,-3){1.2}} \multiput(50,34)(-5.8,-1.933){6}{\line(-3,-1){3.6}} \put(12,21){$y_p $}\put(22,8){\vector(-1,3){10.5}} \put(10,41){$y $} \end{picture} y y y P P x y x P P x x P Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 50 / 54

\begin{picture}(4.3,5.6)(-3,-0.25) \put(-2,0){\vector(1,0){4.4}} \put(2.45,-.05){$x$} \put(0,0){\vector(0,1){3.2}} \put(0,3.35){\makebox(0,0){$y$}} \qbezier(0.0,0.0)(1.2384,0.0) (2.0,2.7622) \qbezier(0.0,0.0)(-1.2384,0.0) (-2.0,2.7622) \put(.3,.12763){\line(1, 0){.4}} \put(.5, -.07237){\line(0, 1){.4}} \put(.8,.54308){\line(1,0){.4}} \put(1,.34308){\line(0,1){.4}} \put(1.3,1.35241){\line(1,0){.4}} \put(1.5,1.15241){\line(0,1){.4}} \put(-0.4,-0.8){$y = \ch x -1$} \end{picture} y y = ch x 1 x Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 51 / 54

\setlength{\unitlength}{1mm} \begin{picture}(90,42)(-5,0) \put(0,15){\vector(1,0){57}} \put(25,0){\vector(0,1){32}} \multiput(0,5)(4,0){13} {\line(1,0){2}} \multiput(0,25)(4,0){13} {\line(1,0){2}} \qbezier(25,15)(34,24)(45,24.6) \qbezier(25,15)(16, 6)( 5,5.4) \put(10,-5){$y = \arctg x $} \end{picture} y = arctg x Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 52 / 54

Néhány gyakorlati megközelítésű leírás http://www.math.bme.hu/latex/lakk_free.pdf www.ursoswald.ch/latexgraphics/picture/picture.html en.wikibooks.org/wiki/latex/picture www.math.wvu.edu/~mays/696/latex_picture_env.pdf http://www.w3.org/tr/svg/overview.html Tóth László (BME) Vektorgrafikus ábrák készítése LATEX-ben 2013. február 4. 54 / 54