Police chasing with TikZ
Clash Royale CLAN TAG#URR8PPP
up vote
10
down vote
favorite
2
Consider the following MWE:
documentclass[border=5pt,tikz]standalone
usetikzlibraryintersections,snakes
tikzstylewater = [decorate,decoration=zigzag,segment length=3mm,amplitude=.5mm]
definecolorpoliceRGB27,128,196
definecolorsireneRGB240,79,35
definecolorwindowsRGB189,230,250
definecolortireRGB121,131,140
definecolormarkRGB246,235,21
definecolorstarRGB242,103,34
definecolorstreetRGB46,46,46
definecolorforestRGB34,139,34
definecolordeepRGB31,61,12
definecoloraquaRGB107,202,226
tikzset
pentagon/.style=
append after command=
pgfextra
beginscope[shift=(tikzlastnode),rotate=17.5,scale=.1]
path[name path=linie1] (72:1) -- (3*72:1);
path[name path=linie2] (0:1) -- (2*72:1);
path[name intersections=of=linie1 and linie2, by=s];
path[name path=linie3] (72:1) -- (4*72:1);
path[name intersections=of=linie3 and linie2, by=s1];
path[name path=linie4] (2*72:1) -- (4*72:1);
path[name path=linie5] (72:1) -- (3*72:1);
path[name intersections=of=linie4 and linie5, by=s2];
path[name path=linie6] (0:1) -- (3*72:1);
path[name path=linie7] (2*72:1) -- (4*72:1);
path[name intersections=of=linie6 and linie7, by=s3];
path[name path=linie7] (72:1) -- (4*72:1);
path[name path=linie8] (3*72:1) -- (0:1);
path[name intersections=of=linie7 and linie8, by=s4];
draw[fill=#1] (0:1) -- (s1) -- (72:1) -- (s) -- (2*72:1) -- (s2) -- (3*72:1) -- (s3) -- (4*72:1) -- (s4) -- cycle;
endscope
,
police car/.style=
append after command=
pgfextra
node[minimum width=1cm,minimum height=.5cm] (a) at (tikzlastnode) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=police] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=white] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
fill[black,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[black,radius=.1] ([xshift=-.1cm]a.south east) circle;
fill[sirene] ([xshift=0cm]a.north) -- ([xshift=.15cm]a.north) arc(0:180:.075);
node[xshift=.05cm,yshift=-.13cm,pentagon=yellow] at (a.center) ;
,
racer/.style=
append after command=
pgfextra
beginscope[rotate=#1]
node[rotate=#1,minimum width=1cm,minimum height=.5cm] (a) at (tikzlastnode) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=black] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=black] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- (a.south east);
fill[tire,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[tire,radius=.1] ([xshift=-.1cm]a.south east) circle;
endscope
begindocument
begintikzpicture
draw[scale=1.1,xshift=-.5cm,yshift=.5cm,fill=street,yshift=-2cm,rounded corners] (0,0) rectangle (10,-8);
draw[xshift=.25cm,yshift=.25cm,fill=aqua,rounded corners,yshift=-3.5cm,xshift=1.5cm] (0,0) rectangle (2,-2);
draw[xshift=0cm,yshift=.25cm,fill=forest,rounded corners,yshift=-3.5cm,xshift=6.5cm] (0,0) rectangle (2,-2);
beginscope[yshift=-.5cm]
draw[fill=forest,rounded corners,yshift=-6.5cm,xshift=1.5cm] (0,0) rectangle (7,-2);
foreach x in 1,2,...,5
fill[xshift=9.3cm,yshift=-7.7cm,deep,rotate=180] (1.3*x,0) arc(180:360:.5) -- (1.3*x+1,0) parabola[parabola height=1mm] (1.3*x,0);
endscope
draw[ultra thick,yellow!90!black,xshift=.55cm,yshift=-2.5cm,rounded corners,dashed,scale=.9] (0,0) rectangle (10,-8);
draw[ultra thick,yellow!90!black,yshift=-2cm,rounded corners,dashed] (5,-.5) --+ (0,-3.5) --+ (-4.5,-3.5) --+ (4.55,-3.5);
draw[xshift=.25cm,yshift=.25cm,yshift=-4cm,xshift=1.5cm,water,blue] (.3,0) -- (1.7,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4.3cm,xshift=1.5cm,water,blue] (.3,0) -- (1,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4.6cm,xshift=1.5cm,water,blue] (1,0) -- (1.7,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4cm,yshift=-.9cm,xshift=1.5cm,water,blue] (.3,0) -- (1.7,0);
node[police car] at (5,-2) ;
node[racer=90] at (0,-5) ;
draw[xshift=.7cm,ultra thick,blue,opacity=.7,->] (5,-2) -- (9,-2) arc(-270:-360:.5) --+ (0,-4);
draw[xshift=.7cm,ultra thick,red,opacity=.7,->] (-.5,-5.6) --+ (0,-.5) arc(180:270:.5) --+ (9.5,0);
endtikzpicture
enddocument
Here is the output:
My question is: How can I achieve that the cars move along the arrows, so that the officer gets the racer?
tikz-pgf animations
asked Aug 25 at 2:16
current_user
2,414428
add a comment |Â
up vote
10
down vote
favorite
2
Consider the following MWE:
documentclass[border=5pt,tikz]standalone
usetikzlibraryintersections,snakes
tikzstylewater = [decorate,decoration=zigzag,segment length=3mm,amplitude=.5mm]
definecolorpoliceRGB27,128,196
definecolorsireneRGB240,79,35
definecolorwindowsRGB189,230,250
definecolortireRGB121,131,140
definecolormarkRGB246,235,21
definecolorstarRGB242,103,34
definecolorstreetRGB46,46,46
definecolorforestRGB34,139,34
definecolordeepRGB31,61,12
definecoloraquaRGB107,202,226
tikzset
pentagon/.style=
append after command=
pgfextra
beginscope[shift=(tikzlastnode),rotate=17.5,scale=.1]
path[name path=linie1] (72:1) -- (3*72:1);
path[name path=linie2] (0:1) -- (2*72:1);
path[name intersections=of=linie1 and linie2, by=s];
path[name path=linie3] (72:1) -- (4*72:1);
path[name intersections=of=linie3 and linie2, by=s1];
path[name path=linie4] (2*72:1) -- (4*72:1);
path[name path=linie5] (72:1) -- (3*72:1);
path[name intersections=of=linie4 and linie5, by=s2];
path[name path=linie6] (0:1) -- (3*72:1);
path[name path=linie7] (2*72:1) -- (4*72:1);
path[name intersections=of=linie6 and linie7, by=s3];
path[name path=linie7] (72:1) -- (4*72:1);
path[name path=linie8] (3*72:1) -- (0:1);
path[name intersections=of=linie7 and linie8, by=s4];
draw[fill=#1] (0:1) -- (s1) -- (72:1) -- (s) -- (2*72:1) -- (s2) -- (3*72:1) -- (s3) -- (4*72:1) -- (s4) -- cycle;
endscope
,
police car/.style=
append after command=
pgfextra
node[minimum width=1cm,minimum height=.5cm] (a) at (tikzlastnode) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=police] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=white] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
fill[black,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[black,radius=.1] ([xshift=-.1cm]a.south east) circle;
fill[sirene] ([xshift=0cm]a.north) -- ([xshift=.15cm]a.north) arc(0:180:.075);
node[xshift=.05cm,yshift=-.13cm,pentagon=yellow] at (a.center) ;
,
racer/.style=
append after command=
pgfextra
beginscope[rotate=#1]
node[rotate=#1,minimum width=1cm,minimum height=.5cm] (a) at (tikzlastnode) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=black] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=black] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- (a.south east);
fill[tire,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[tire,radius=.1] ([xshift=-.1cm]a.south east) circle;
endscope
begindocument
begintikzpicture
draw[scale=1.1,xshift=-.5cm,yshift=.5cm,fill=street,yshift=-2cm,rounded corners] (0,0) rectangle (10,-8);
draw[xshift=.25cm,yshift=.25cm,fill=aqua,rounded corners,yshift=-3.5cm,xshift=1.5cm] (0,0) rectangle (2,-2);
draw[xshift=0cm,yshift=.25cm,fill=forest,rounded corners,yshift=-3.5cm,xshift=6.5cm] (0,0) rectangle (2,-2);
beginscope[yshift=-.5cm]
draw[fill=forest,rounded corners,yshift=-6.5cm,xshift=1.5cm] (0,0) rectangle (7,-2);
foreach x in 1,2,...,5
fill[xshift=9.3cm,yshift=-7.7cm,deep,rotate=180] (1.3*x,0) arc(180:360:.5) -- (1.3*x+1,0) parabola[parabola height=1mm] (1.3*x,0);
endscope
draw[ultra thick,yellow!90!black,xshift=.55cm,yshift=-2.5cm,rounded corners,dashed,scale=.9] (0,0) rectangle (10,-8);
draw[ultra thick,yellow!90!black,yshift=-2cm,rounded corners,dashed] (5,-.5) --+ (0,-3.5) --+ (-4.5,-3.5) --+ (4.55,-3.5);
draw[xshift=.25cm,yshift=.25cm,yshift=-4cm,xshift=1.5cm,water,blue] (.3,0) -- (1.7,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4.3cm,xshift=1.5cm,water,blue] (.3,0) -- (1,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4.6cm,xshift=1.5cm,water,blue] (1,0) -- (1.7,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4cm,yshift=-.9cm,xshift=1.5cm,water,blue] (.3,0) -- (1.7,0);
node[police car] at (5,-2) ;
node[racer=90] at (0,-5) ;
draw[xshift=.7cm,ultra thick,blue,opacity=.7,->] (5,-2) -- (9,-2) arc(-270:-360:.5) --+ (0,-4);
draw[xshift=.7cm,ultra thick,red,opacity=.7,->] (-.5,-5.6) --+ (0,-.5) arc(180:270:.5) --+ (9.5,0);
endtikzpicture
enddocument
Here is the output:
My question is: How can I achieve that the cars move along the arrows, so that the officer gets the racer?
tikz-pgf animations
asked Aug 25 at 2:16
current_user
2,414428
1
I would put the cars insaveboxesand then move them along the paths withdecorations.markings....
– marmot
Aug 25 at 2:34
1
You can use reflective paint for the arrows, and then mount steering light sensors on the cars.
– hpekristiansen
Aug 25 at 2:42
@marmot, hpekristiansen: Could you post please a MWE (if it's no problem)?
– current_user
Aug 25 at 2:51
1
why tie your hands drawing complex images in code that at the end generates a vector type image, you can import svg sprites in pdf format using the graphicx package, and take advantage of tikz's parametric abilities to change them and move them, as @marmot suggests, or using nodes in the path.
– J Leon V.
Aug 25 at 3:04
1
I really like the indentation on your source code :)
– cmhughes
Aug 26 at 8:48
add a comment |Â
up vote
10
down vote
favorite
2
up vote
10
down vote
favorite
2
2
Consider the following MWE:
documentclass[border=5pt,tikz]standalone
usetikzlibraryintersections,snakes
tikzstylewater = [decorate,decoration=zigzag,segment length=3mm,amplitude=.5mm]
definecolorpoliceRGB27,128,196
definecolorsireneRGB240,79,35
definecolorwindowsRGB189,230,250
definecolortireRGB121,131,140
definecolormarkRGB246,235,21
definecolorstarRGB242,103,34
definecolorstreetRGB46,46,46
definecolorforestRGB34,139,34
definecolordeepRGB31,61,12
definecoloraquaRGB107,202,226
tikzset
pentagon/.style=
append after command=
pgfextra
beginscope[shift=(tikzlastnode),rotate=17.5,scale=.1]
path[name path=linie1] (72:1) -- (3*72:1);
path[name path=linie2] (0:1) -- (2*72:1);
path[name intersections=of=linie1 and linie2, by=s];
path[name path=linie3] (72:1) -- (4*72:1);
path[name intersections=of=linie3 and linie2, by=s1];
path[name path=linie4] (2*72:1) -- (4*72:1);
path[name path=linie5] (72:1) -- (3*72:1);
path[name intersections=of=linie4 and linie5, by=s2];
path[name path=linie6] (0:1) -- (3*72:1);
path[name path=linie7] (2*72:1) -- (4*72:1);
path[name intersections=of=linie6 and linie7, by=s3];
path[name path=linie7] (72:1) -- (4*72:1);
path[name path=linie8] (3*72:1) -- (0:1);
path[name intersections=of=linie7 and linie8, by=s4];
draw[fill=#1] (0:1) -- (s1) -- (72:1) -- (s) -- (2*72:1) -- (s2) -- (3*72:1) -- (s3) -- (4*72:1) -- (s4) -- cycle;
endscope
,
police car/.style=
append after command=
pgfextra
node[minimum width=1cm,minimum height=.5cm] (a) at (tikzlastnode) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=police] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=white] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
fill[black,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[black,radius=.1] ([xshift=-.1cm]a.south east) circle;
fill[sirene] ([xshift=0cm]a.north) -- ([xshift=.15cm]a.north) arc(0:180:.075);
node[xshift=.05cm,yshift=-.13cm,pentagon=yellow] at (a.center) ;
,
racer/.style=
append after command=
pgfextra
beginscope[rotate=#1]
node[rotate=#1,minimum width=1cm,minimum height=.5cm] (a) at (tikzlastnode) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=black] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=black] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- (a.south east);
fill[tire,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[tire,radius=.1] ([xshift=-.1cm]a.south east) circle;
endscope
begindocument
begintikzpicture
draw[scale=1.1,xshift=-.5cm,yshift=.5cm,fill=street,yshift=-2cm,rounded corners] (0,0) rectangle (10,-8);
draw[xshift=.25cm,yshift=.25cm,fill=aqua,rounded corners,yshift=-3.5cm,xshift=1.5cm] (0,0) rectangle (2,-2);
draw[xshift=0cm,yshift=.25cm,fill=forest,rounded corners,yshift=-3.5cm,xshift=6.5cm] (0,0) rectangle (2,-2);
beginscope[yshift=-.5cm]
draw[fill=forest,rounded corners,yshift=-6.5cm,xshift=1.5cm] (0,0) rectangle (7,-2);
foreach x in 1,2,...,5
fill[xshift=9.3cm,yshift=-7.7cm,deep,rotate=180] (1.3*x,0) arc(180:360:.5) -- (1.3*x+1,0) parabola[parabola height=1mm] (1.3*x,0);
endscope
draw[ultra thick,yellow!90!black,xshift=.55cm,yshift=-2.5cm,rounded corners,dashed,scale=.9] (0,0) rectangle (10,-8);
draw[ultra thick,yellow!90!black,yshift=-2cm,rounded corners,dashed] (5,-.5) --+ (0,-3.5) --+ (-4.5,-3.5) --+ (4.55,-3.5);
draw[xshift=.25cm,yshift=.25cm,yshift=-4cm,xshift=1.5cm,water,blue] (.3,0) -- (1.7,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4.3cm,xshift=1.5cm,water,blue] (.3,0) -- (1,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4.6cm,xshift=1.5cm,water,blue] (1,0) -- (1.7,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4cm,yshift=-.9cm,xshift=1.5cm,water,blue] (.3,0) -- (1.7,0);
node[police car] at (5,-2) ;
node[racer=90] at (0,-5) ;
draw[xshift=.7cm,ultra thick,blue,opacity=.7,->] (5,-2) -- (9,-2) arc(-270:-360:.5) --+ (0,-4);
draw[xshift=.7cm,ultra thick,red,opacity=.7,->] (-.5,-5.6) --+ (0,-.5) arc(180:270:.5) --+ (9.5,0);
endtikzpicture
enddocument
Here is the output:
My question is: How can I achieve that the cars move along the arrows, so that the officer gets the racer?
tikz-pgf animations
asked Aug 25 at 2:16
current_user
2,414428
Consider the following MWE:
documentclass[border=5pt,tikz]standalone
usetikzlibraryintersections,snakes
tikzstylewater = [decorate,decoration=zigzag,segment length=3mm,amplitude=.5mm]
definecolorpoliceRGB27,128,196
definecolorsireneRGB240,79,35
definecolorwindowsRGB189,230,250
definecolortireRGB121,131,140
definecolormarkRGB246,235,21
definecolorstarRGB242,103,34
definecolorstreetRGB46,46,46
definecolorforestRGB34,139,34
definecolordeepRGB31,61,12
definecoloraquaRGB107,202,226
tikzset
pentagon/.style=
append after command=
pgfextra
beginscope[shift=(tikzlastnode),rotate=17.5,scale=.1]
path[name path=linie1] (72:1) -- (3*72:1);
path[name path=linie2] (0:1) -- (2*72:1);
path[name intersections=of=linie1 and linie2, by=s];
path[name path=linie3] (72:1) -- (4*72:1);
path[name intersections=of=linie3 and linie2, by=s1];
path[name path=linie4] (2*72:1) -- (4*72:1);
path[name path=linie5] (72:1) -- (3*72:1);
path[name intersections=of=linie4 and linie5, by=s2];
path[name path=linie6] (0:1) -- (3*72:1);
path[name path=linie7] (2*72:1) -- (4*72:1);
path[name intersections=of=linie6 and linie7, by=s3];
path[name path=linie7] (72:1) -- (4*72:1);
path[name path=linie8] (3*72:1) -- (0:1);
path[name intersections=of=linie7 and linie8, by=s4];
draw[fill=#1] (0:1) -- (s1) -- (72:1) -- (s) -- (2*72:1) -- (s2) -- (3*72:1) -- (s3) -- (4*72:1) -- (s4) -- cycle;
endscope
,
police car/.style=
append after command=
pgfextra
node[minimum width=1cm,minimum height=.5cm] (a) at (tikzlastnode) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=police] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=white] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
fill[black,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[black,radius=.1] ([xshift=-.1cm]a.south east) circle;
fill[sirene] ([xshift=0cm]a.north) -- ([xshift=.15cm]a.north) arc(0:180:.075);
node[xshift=.05cm,yshift=-.13cm,pentagon=yellow] at (a.center) ;
,
racer/.style=
append after command=
pgfextra
beginscope[rotate=#1]
node[rotate=#1,minimum width=1cm,minimum height=.5cm] (a) at (tikzlastnode) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=black] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=black] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- (a.south east);
fill[tire,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[tire,radius=.1] ([xshift=-.1cm]a.south east) circle;
endscope
begindocument
begintikzpicture
draw[scale=1.1,xshift=-.5cm,yshift=.5cm,fill=street,yshift=-2cm,rounded corners] (0,0) rectangle (10,-8);
draw[xshift=.25cm,yshift=.25cm,fill=aqua,rounded corners,yshift=-3.5cm,xshift=1.5cm] (0,0) rectangle (2,-2);
draw[xshift=0cm,yshift=.25cm,fill=forest,rounded corners,yshift=-3.5cm,xshift=6.5cm] (0,0) rectangle (2,-2);
beginscope[yshift=-.5cm]
draw[fill=forest,rounded corners,yshift=-6.5cm,xshift=1.5cm] (0,0) rectangle (7,-2);
foreach x in 1,2,...,5
fill[xshift=9.3cm,yshift=-7.7cm,deep,rotate=180] (1.3*x,0) arc(180:360:.5) -- (1.3*x+1,0) parabola[parabola height=1mm] (1.3*x,0);
endscope
draw[ultra thick,yellow!90!black,xshift=.55cm,yshift=-2.5cm,rounded corners,dashed,scale=.9] (0,0) rectangle (10,-8);
draw[ultra thick,yellow!90!black,yshift=-2cm,rounded corners,dashed] (5,-.5) --+ (0,-3.5) --+ (-4.5,-3.5) --+ (4.55,-3.5);
draw[xshift=.25cm,yshift=.25cm,yshift=-4cm,xshift=1.5cm,water,blue] (.3,0) -- (1.7,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4.3cm,xshift=1.5cm,water,blue] (.3,0) -- (1,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4.6cm,xshift=1.5cm,water,blue] (1,0) -- (1.7,0);
draw[xshift=.25cm,yshift=.25cm,yshift=-4cm,yshift=-.9cm,xshift=1.5cm,water,blue] (.3,0) -- (1.7,0);
node[police car] at (5,-2) ;
node[racer=90] at (0,-5) ;
draw[xshift=.7cm,ultra thick,blue,opacity=.7,->] (5,-2) -- (9,-2) arc(-270:-360:.5) --+ (0,-4);
draw[xshift=.7cm,ultra thick,red,opacity=.7,->] (-.5,-5.6) --+ (0,-.5) arc(180:270:.5) --+ (9.5,0);
endtikzpicture
enddocument
Here is the output:
My question is: How can I achieve that the cars move along the arrows, so that the officer gets the racer?
tikz-pgf animations
asked Aug 25 at 2:16
current_user
2,414428
asked Aug 25 at 2:16
current_user
2,414428
asked Aug 25 at 2:16
current_user
2,414428
asked Aug 25 at 2:16
current_user
2,414428
2,414428
1
I would put the cars insaveboxesand then move them along the paths withdecorations.markings....
– marmot
Aug 25 at 2:34
1
You can use reflective paint for the arrows, and then mount steering light sensors on the cars.
– hpekristiansen
Aug 25 at 2:42
@marmot, hpekristiansen: Could you post please a MWE (if it's no problem)?
– current_user
Aug 25 at 2:51
1
why tie your hands drawing complex images in code that at the end generates a vector type image, you can import svg sprites in pdf format using the graphicx package, and take advantage of tikz's parametric abilities to change them and move them, as @marmot suggests, or using nodes in the path.
– J Leon V.
Aug 25 at 3:04
1
I really like the indentation on your source code :)
– cmhughes
Aug 26 at 8:48
add a comment |Â
1
I would put the cars insaveboxesand then move them along the paths withdecorations.markings....
– marmot
Aug 25 at 2:34
1
You can use reflective paint for the arrows, and then mount steering light sensors on the cars.
– hpekristiansen
Aug 25 at 2:42
@marmot, hpekristiansen: Could you post please a MWE (if it's no problem)?
– current_user
Aug 25 at 2:51
1
why tie your hands drawing complex images in code that at the end generates a vector type image, you can import svg sprites in pdf format using the graphicx package, and take advantage of tikz's parametric abilities to change them and move them, as @marmot suggests, or using nodes in the path.
– J Leon V.
Aug 25 at 3:04
1
I really like the indentation on your source code :)
– cmhughes
Aug 26 at 8:48
1
1
I would put the cars in
saveboxes and then move them along the paths with decorations.markings....– marmot
Aug 25 at 2:34
I would put the cars in
saveboxes and then move them along the paths with decorations.markings....– marmot
Aug 25 at 2:34
1
1
You can use reflective paint for the arrows, and then mount steering light sensors on the cars.
– hpekristiansen
Aug 25 at 2:42
You can use reflective paint for the arrows, and then mount steering light sensors on the cars.
– hpekristiansen
Aug 25 at 2:42
@marmot, hpekristiansen: Could you post please a MWE (if it's no problem)?
– current_user
Aug 25 at 2:51
@marmot, hpekristiansen: Could you post please a MWE (if it's no problem)?
– current_user
Aug 25 at 2:51
1
1
why tie your hands drawing complex images in code that at the end generates a vector type image, you can import svg sprites in pdf format using the graphicx package, and take advantage of tikz's parametric abilities to change them and move them, as @marmot suggests, or using nodes in the path.
– J Leon V.
Aug 25 at 3:04
why tie your hands drawing complex images in code that at the end generates a vector type image, you can import svg sprites in pdf format using the graphicx package, and take advantage of tikz's parametric abilities to change them and move them, as @marmot suggests, or using nodes in the path.
– J Leon V.
Aug 25 at 3:04
1
1
I really like the indentation on your source code :)
– cmhughes
Aug 26 at 8:48
I really like the indentation on your source code :)
– cmhughes
Aug 26 at 8:48
add a comment |Â
2 Answers
2
active
oldest
votes
up vote
12
down vote
accepted
Here is a first version. I was not aware that the rounded corners had such an impact on the tangent slope. My bad, fixed it
documentclass[border=5pt,tikz]standalone
usetikzlibraryintersections,snakes,decorations.markings,calc,shapes.geometric
tikzsetwater/.style=decorate,decoration=zigzag,segment
length=3mm,amplitude=.5mm
definecolorpoliceRGB27,128,196
definecolorsireneRGB240,79,35
definecolorwindowsRGB189,230,250
definecolortireRGB121,131,140
definecolormarkRGB246,235,21
definecolorstarRGB242,103,34
definecolorstreetRGB46,46,46
definecolorforestRGB34,139,34
definecolordeepRGB31,61,12
definecoloraquaRGB107,202,226
tikzset
pentagon/.style=
shape=star, star points=5, star point ratio=1.9, draw,minimum
width=3mm,fill=#1
newsaveboxPoliceCar
sboxPoliceCartikz
node[minimum width=1cm,minimum height=.5cm] (a) at (0,0) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=police] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=white] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
fill[black,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[black,radius=.1] ([xshift=-.1cm]a.south east) circle;
fill[sirene] ([xshift=0cm]a.north) -- ([xshift=.15cm]a.north) arc(0:180:.075);
node[xshift=.05cm,yshift=-.13cm,pentagon=yellow,scale=0.3] at (a.center) ;
newsaveboxRacer
sboxRacertikznode[minimum width=1cm,minimum height=.5cm] (a) at
(0,0) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=black] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=black] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- (a.south east);
fill[tire,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[tire,radius=.1] ([xshift=-.1cm]a.south east) circle;
begindocument
foreach X in 0,0.03,...,0.9
- (9,-6.1);
endtikzpicture
enddocument
answered Aug 25 at 3:17
marmot
55.2k459120
Nice work but the police car turn is less successful than the other: the car makes a right angle that is not realistic!
– AndréC
Aug 25 at 5:17
@AndréC I know. This is by far the most unrealistic thing in the whole animation. ;-) (More seriously, cars do not follow straight line - arc - straight line. This is because the curvature jumps along such paths. However, one moves the steering wheel in a continuous way, so in the real world the curvature does not jump. So even if I might move the car to the center of the decoration, it will not become "realistic" unless I change the path.)
– marmot
Aug 25 at 10:33
add a comment |Â
up vote
8
down vote
just for fun and to expose my point, I use the recycled code to draw the road from Drawing street curve, then doing the positioning node in a path including an image, in this case images transformed to svg edited in inkscape and exported to pdf format, you can access these files on my drive, available until the big G disappears, consists of 4 sprites 2 for each car, which I alternate in a certain frame.
RESULT:
MWE: To run you need to download the pdf files Sprite-police-side.pdf,Sprite-police-front.pdf,Sprite-car-front.pdf,Sprite-car-side.pdf, or any tikz pdf output, inkscape pdf output,etc., to the forder where the main .tex file is saved.
% arara: pdflatex: synctex: yes, action: nonstopmode
% arara: animate: density: 100, delay: 13, other: -background white -alpha remove
% arara: showanimate
documentclass[tikz,border=20pt]standalone
usetikzlibraryarrows,positioning,backgrounds,patterns
definecolorgrassHTML296402
definecolorwayHTML373737
tikzset
%STYLES
runway node/.style=% Runway
rounded corners,
way,
line width=54pt,
preaction=
draw,
way,
line width=60pt,
,
preaction=
draw,
yellow,
line width=55pt, % Yellow border lines.
,
postaction=
draw,
white,
line width=19pt,
dash pattern=on 35pt off 15pt, % Here control the road division lines
,
postaction=
draw,
way,
line width=18pt,
begindocument
foreach x in 1,...,30 ++(6,-6)node[pos=x/30]includegraphics[scale=0.15]Sprite-police-front;
fi
draw[ultra thick,->,red,rounded corners=1cm]
(0,-3)
ifnumx<16
enddocument
PSD: animation done with imagemagick converter.
answered Aug 25 at 6:51
J Leon V.
6,151528
add a comment |Â
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
12
down vote
accepted
Here is a first version. I was not aware that the rounded corners had such an impact on the tangent slope. My bad, fixed it
documentclass[border=5pt,tikz]standalone
usetikzlibraryintersections,snakes,decorations.markings,calc,shapes.geometric
tikzsetwater/.style=decorate,decoration=zigzag,segment
length=3mm,amplitude=.5mm
definecolorpoliceRGB27,128,196
definecolorsireneRGB240,79,35
definecolorwindowsRGB189,230,250
definecolortireRGB121,131,140
definecolormarkRGB246,235,21
definecolorstarRGB242,103,34
definecolorstreetRGB46,46,46
definecolorforestRGB34,139,34
definecolordeepRGB31,61,12
definecoloraquaRGB107,202,226
tikzset
pentagon/.style=
shape=star, star points=5, star point ratio=1.9, draw,minimum
width=3mm,fill=#1
newsaveboxPoliceCar
sboxPoliceCartikz
node[minimum width=1cm,minimum height=.5cm] (a) at (0,0) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=police] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=white] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
fill[black,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[black,radius=.1] ([xshift=-.1cm]a.south east) circle;
fill[sirene] ([xshift=0cm]a.north) -- ([xshift=.15cm]a.north) arc(0:180:.075);
node[xshift=.05cm,yshift=-.13cm,pentagon=yellow,scale=0.3] at (a.center) ;
newsaveboxRacer
sboxRacertikznode[minimum width=1cm,minimum height=.5cm] (a) at
(0,0) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=black] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=black] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- (a.south east);
fill[tire,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[tire,radius=.1] ([xshift=-.1cm]a.south east) circle;
begindocument
foreach X in 0,0.03,...,0.9
- (9,-6.1);
endtikzpicture
enddocument
answered Aug 25 at 3:17
marmot
55.2k459120
Nice work but the police car turn is less successful than the other: the car makes a right angle that is not realistic!
– AndréC
Aug 25 at 5:17
@AndréC I know. This is by far the most unrealistic thing in the whole animation. ;-) (More seriously, cars do not follow straight line - arc - straight line. This is because the curvature jumps along such paths. However, one moves the steering wheel in a continuous way, so in the real world the curvature does not jump. So even if I might move the car to the center of the decoration, it will not become "realistic" unless I change the path.)
– marmot
Aug 25 at 10:33
add a comment |Â
up vote
12
down vote
accepted
Here is a first version. I was not aware that the rounded corners had such an impact on the tangent slope. My bad, fixed it
documentclass[border=5pt,tikz]standalone
usetikzlibraryintersections,snakes,decorations.markings,calc,shapes.geometric
tikzsetwater/.style=decorate,decoration=zigzag,segment
length=3mm,amplitude=.5mm
definecolorpoliceRGB27,128,196
definecolorsireneRGB240,79,35
definecolorwindowsRGB189,230,250
definecolortireRGB121,131,140
definecolormarkRGB246,235,21
definecolorstarRGB242,103,34
definecolorstreetRGB46,46,46
definecolorforestRGB34,139,34
definecolordeepRGB31,61,12
definecoloraquaRGB107,202,226
tikzset
pentagon/.style=
shape=star, star points=5, star point ratio=1.9, draw,minimum
width=3mm,fill=#1
newsaveboxPoliceCar
sboxPoliceCartikz
node[minimum width=1cm,minimum height=.5cm] (a) at (0,0) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=police] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=white] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
fill[black,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[black,radius=.1] ([xshift=-.1cm]a.south east) circle;
fill[sirene] ([xshift=0cm]a.north) -- ([xshift=.15cm]a.north) arc(0:180:.075);
node[xshift=.05cm,yshift=-.13cm,pentagon=yellow,scale=0.3] at (a.center) ;
newsaveboxRacer
sboxRacertikznode[minimum width=1cm,minimum height=.5cm] (a) at
(0,0) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=black] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=black] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- (a.south east);
fill[tire,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[tire,radius=.1] ([xshift=-.1cm]a.south east) circle;
begindocument
foreach X in 0,0.03,...,0.9
- (9,-6.1);
endtikzpicture
enddocument
answered Aug 25 at 3:17
marmot
55.2k459120
Nice work but the police car turn is less successful than the other: the car makes a right angle that is not realistic!
– AndréC
Aug 25 at 5:17
@AndréC I know. This is by far the most unrealistic thing in the whole animation. ;-) (More seriously, cars do not follow straight line - arc - straight line. This is because the curvature jumps along such paths. However, one moves the steering wheel in a continuous way, so in the real world the curvature does not jump. So even if I might move the car to the center of the decoration, it will not become "realistic" unless I change the path.)
– marmot
Aug 25 at 10:33
add a comment |Â
up vote
12
down vote
accepted
up vote
12
down vote
accepted
Here is a first version. I was not aware that the rounded corners had such an impact on the tangent slope. My bad, fixed it
documentclass[border=5pt,tikz]standalone
usetikzlibraryintersections,snakes,decorations.markings,calc,shapes.geometric
tikzsetwater/.style=decorate,decoration=zigzag,segment
length=3mm,amplitude=.5mm
definecolorpoliceRGB27,128,196
definecolorsireneRGB240,79,35
definecolorwindowsRGB189,230,250
definecolortireRGB121,131,140
definecolormarkRGB246,235,21
definecolorstarRGB242,103,34
definecolorstreetRGB46,46,46
definecolorforestRGB34,139,34
definecolordeepRGB31,61,12
definecoloraquaRGB107,202,226
tikzset
pentagon/.style=
shape=star, star points=5, star point ratio=1.9, draw,minimum
width=3mm,fill=#1
newsaveboxPoliceCar
sboxPoliceCartikz
node[minimum width=1cm,minimum height=.5cm] (a) at (0,0) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=police] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=white] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
fill[black,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[black,radius=.1] ([xshift=-.1cm]a.south east) circle;
fill[sirene] ([xshift=0cm]a.north) -- ([xshift=.15cm]a.north) arc(0:180:.075);
node[xshift=.05cm,yshift=-.13cm,pentagon=yellow,scale=0.3] at (a.center) ;
newsaveboxRacer
sboxRacertikznode[minimum width=1cm,minimum height=.5cm] (a) at
(0,0) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=black] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=black] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- (a.south east);
fill[tire,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[tire,radius=.1] ([xshift=-.1cm]a.south east) circle;
begindocument
foreach X in 0,0.03,...,0.9
- (9,-6.1);
endtikzpicture
enddocument
answered Aug 25 at 3:17
marmot
55.2k459120
Here is a first version. I was not aware that the rounded corners had such an impact on the tangent slope. My bad, fixed it
documentclass[border=5pt,tikz]standalone
usetikzlibraryintersections,snakes,decorations.markings,calc,shapes.geometric
tikzsetwater/.style=decorate,decoration=zigzag,segment
length=3mm,amplitude=.5mm
definecolorpoliceRGB27,128,196
definecolorsireneRGB240,79,35
definecolorwindowsRGB189,230,250
definecolortireRGB121,131,140
definecolormarkRGB246,235,21
definecolorstarRGB242,103,34
definecolorstreetRGB46,46,46
definecolorforestRGB34,139,34
definecolordeepRGB31,61,12
definecoloraquaRGB107,202,226
tikzset
pentagon/.style=
shape=star, star points=5, star point ratio=1.9, draw,minimum
width=3mm,fill=#1
newsaveboxPoliceCar
sboxPoliceCartikz
node[minimum width=1cm,minimum height=.5cm] (a) at (0,0) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=police] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=white] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
fill[black,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[black,radius=.1] ([xshift=-.1cm]a.south east) circle;
fill[sirene] ([xshift=0cm]a.north) -- ([xshift=.15cm]a.north) arc(0:180:.075);
node[xshift=.05cm,yshift=-.13cm,pentagon=yellow,scale=0.3] at (a.center) ;
newsaveboxRacer
sboxRacertikznode[minimum width=1cm,minimum height=.5cm] (a) at
(0,0) ;
fill[windows] ([xshift=.2cm,yshift=.25cm]a.south west) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([xshift=-.1cm,yshift=.25cm]a.south east);
path[fill=black] (a.south west) -- ([yshift=.25cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east);
path[fill=black] ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- ([yshift=.25cm]a.south west) --+ (.2,0) -- ([yshift=-.01cm,xshift=.4cm]a.north west) -- ([yshift=-.01cm,xshift=-.24cm]a.north east) -- ([yshift=.25cm,xshift=.9cm]a.south west) -- ([yshift=.25cm,xshift=.1cm]a.south east) -- ([xshift=.1cm]a.south east) -- cycle;
draw ([xshift=.2cm]a.south west) -- ([xshift=.2cm,yshift=.25cm]a.south west) -- ([xshift=.9cm,yshift=.25cm]a.south west) -- ([xshift=.9cm]a.south west);
draw (a.south west) -- (a.south east);
fill[tire,radius=.1] ([xshift=.2cm]a.south west) circle;
fill[tire,radius=.1] ([xshift=-.1cm]a.south east) circle;
begindocument
foreach X in 0,0.03,...,0.9
- (9,-6.1);
endtikzpicture
enddocument
answered Aug 25 at 3:17
marmot
55.2k459120
edited Aug 25 at 4:08
answered Aug 25 at 3:17
marmot
55.2k459120
answered Aug 25 at 3:17
marmot
55.2k459120
answered Aug 25 at 3:17
marmot
55.2k459120
55.2k459120
Nice work but the police car turn is less successful than the other: the car makes a right angle that is not realistic!
– AndréC
Aug 25 at 5:17
@AndréC I know. This is by far the most unrealistic thing in the whole animation. ;-) (More seriously, cars do not follow straight line - arc - straight line. This is because the curvature jumps along such paths. However, one moves the steering wheel in a continuous way, so in the real world the curvature does not jump. So even if I might move the car to the center of the decoration, it will not become "realistic" unless I change the path.)
– marmot
Aug 25 at 10:33
add a comment |Â
Nice work but the police car turn is less successful than the other: the car makes a right angle that is not realistic!
– AndréC
Aug 25 at 5:17
@AndréC I know. This is by far the most unrealistic thing in the whole animation. ;-) (More seriously, cars do not follow straight line - arc - straight line. This is because the curvature jumps along such paths. However, one moves the steering wheel in a continuous way, so in the real world the curvature does not jump. So even if I might move the car to the center of the decoration, it will not become "realistic" unless I change the path.)
– marmot
Aug 25 at 10:33
Nice work but the police car turn is less successful than the other: the car makes a right angle that is not realistic!
– AndréC
Aug 25 at 5:17
Nice work but the police car turn is less successful than the other: the car makes a right angle that is not realistic!
– AndréC
Aug 25 at 5:17
@AndréC I know. This is by far the most unrealistic thing in the whole animation. ;-) (More seriously, cars do not follow straight line - arc - straight line. This is because the curvature jumps along such paths. However, one moves the steering wheel in a continuous way, so in the real world the curvature does not jump. So even if I might move the car to the center of the decoration, it will not become "realistic" unless I change the path.)
– marmot
Aug 25 at 10:33
@AndréC I know. This is by far the most unrealistic thing in the whole animation. ;-) (More seriously, cars do not follow straight line - arc - straight line. This is because the curvature jumps along such paths. However, one moves the steering wheel in a continuous way, so in the real world the curvature does not jump. So even if I might move the car to the center of the decoration, it will not become "realistic" unless I change the path.)
– marmot
Aug 25 at 10:33
add a comment |Â
up vote
8
down vote
just for fun and to expose my point, I use the recycled code to draw the road from Drawing street curve, then doing the positioning node in a path including an image, in this case images transformed to svg edited in inkscape and exported to pdf format, you can access these files on my drive, available until the big G disappears, consists of 4 sprites 2 for each car, which I alternate in a certain frame.
RESULT:
MWE: To run you need to download the pdf files Sprite-police-side.pdf,Sprite-police-front.pdf,Sprite-car-front.pdf,Sprite-car-side.pdf, or any tikz pdf output, inkscape pdf output,etc., to the forder where the main .tex file is saved.
% arara: pdflatex: synctex: yes, action: nonstopmode
% arara: animate: density: 100, delay: 13, other: -background white -alpha remove
% arara: showanimate
documentclass[tikz,border=20pt]standalone
usetikzlibraryarrows,positioning,backgrounds,patterns
definecolorgrassHTML296402
definecolorwayHTML373737
tikzset
%STYLES
runway node/.style=% Runway
rounded corners,
way,
line width=54pt,
preaction=
draw,
way,
line width=60pt,
,
preaction=
draw,
yellow,
line width=55pt, % Yellow border lines.
,
postaction=
draw,
white,
line width=19pt,
dash pattern=on 35pt off 15pt, % Here control the road division lines
,
postaction=
draw,
way,
line width=18pt,
begindocument
foreach x in 1,...,30 ++(6,-6)node[pos=x/30]includegraphics[scale=0.15]Sprite-police-front;
fi
draw[ultra thick,->,red,rounded corners=1cm]
(0,-3)
ifnumx<16
enddocument
PSD: animation done with imagemagick converter.
answered Aug 25 at 6:51
J Leon V.
6,151528
add a comment |Â
up vote
8
down vote
just for fun and to expose my point, I use the recycled code to draw the road from Drawing street curve, then doing the positioning node in a path including an image, in this case images transformed to svg edited in inkscape and exported to pdf format, you can access these files on my drive, available until the big G disappears, consists of 4 sprites 2 for each car, which I alternate in a certain frame.
RESULT:
MWE: To run you need to download the pdf files Sprite-police-side.pdf,Sprite-police-front.pdf,Sprite-car-front.pdf,Sprite-car-side.pdf, or any tikz pdf output, inkscape pdf output,etc., to the forder where the main .tex file is saved.
% arara: pdflatex: synctex: yes, action: nonstopmode
% arara: animate: density: 100, delay: 13, other: -background white -alpha remove
% arara: showanimate
documentclass[tikz,border=20pt]standalone
usetikzlibraryarrows,positioning,backgrounds,patterns
definecolorgrassHTML296402
definecolorwayHTML373737
tikzset
%STYLES
runway node/.style=% Runway
rounded corners,
way,
line width=54pt,
preaction=
draw,
way,
line width=60pt,
,
preaction=
draw,
yellow,
line width=55pt, % Yellow border lines.
,
postaction=
draw,
white,
line width=19pt,
dash pattern=on 35pt off 15pt, % Here control the road division lines
,
postaction=
draw,
way,
line width=18pt,
begindocument
foreach x in 1,...,30 ++(6,-6)node[pos=x/30]includegraphics[scale=0.15]Sprite-police-front;
fi
draw[ultra thick,->,red,rounded corners=1cm]
(0,-3)
ifnumx<16
enddocument
PSD: animation done with imagemagick converter.
answered Aug 25 at 6:51
J Leon V.
6,151528
add a comment |Â
up vote
8
down vote
up vote
8
down vote
just for fun and to expose my point, I use the recycled code to draw the road from Drawing street curve, then doing the positioning node in a path including an image, in this case images transformed to svg edited in inkscape and exported to pdf format, you can access these files on my drive, available until the big G disappears, consists of 4 sprites 2 for each car, which I alternate in a certain frame.
RESULT:
MWE: To run you need to download the pdf files Sprite-police-side.pdf,Sprite-police-front.pdf,Sprite-car-front.pdf,Sprite-car-side.pdf, or any tikz pdf output, inkscape pdf output,etc., to the forder where the main .tex file is saved.
% arara: pdflatex: synctex: yes, action: nonstopmode
% arara: animate: density: 100, delay: 13, other: -background white -alpha remove
% arara: showanimate
documentclass[tikz,border=20pt]standalone
usetikzlibraryarrows,positioning,backgrounds,patterns
definecolorgrassHTML296402
definecolorwayHTML373737
tikzset
%STYLES
runway node/.style=% Runway
rounded corners,
way,
line width=54pt,
preaction=
draw,
way,
line width=60pt,
,
preaction=
draw,
yellow,
line width=55pt, % Yellow border lines.
,
postaction=
draw,
white,
line width=19pt,
dash pattern=on 35pt off 15pt, % Here control the road division lines
,
postaction=
draw,
way,
line width=18pt,
begindocument
foreach x in 1,...,30 ++(6,-6)node[pos=x/30]includegraphics[scale=0.15]Sprite-police-front;
fi
draw[ultra thick,->,red,rounded corners=1cm]
(0,-3)
ifnumx<16
enddocument
PSD: animation done with imagemagick converter.
answered Aug 25 at 6:51
J Leon V.
6,151528
just for fun and to expose my point, I use the recycled code to draw the road from Drawing street curve, then doing the positioning node in a path including an image, in this case images transformed to svg edited in inkscape and exported to pdf format, you can access these files on my drive, available until the big G disappears, consists of 4 sprites 2 for each car, which I alternate in a certain frame.
RESULT:
MWE: To run you need to download the pdf files Sprite-police-side.pdf,Sprite-police-front.pdf,Sprite-car-front.pdf,Sprite-car-side.pdf, or any tikz pdf output, inkscape pdf output,etc., to the forder where the main .tex file is saved.
% arara: pdflatex: synctex: yes, action: nonstopmode
% arara: animate: density: 100, delay: 13, other: -background white -alpha remove
% arara: showanimate
documentclass[tikz,border=20pt]standalone
usetikzlibraryarrows,positioning,backgrounds,patterns
definecolorgrassHTML296402
definecolorwayHTML373737
tikzset
%STYLES
runway node/.style=% Runway
rounded corners,
way,
line width=54pt,
preaction=
draw,
way,
line width=60pt,
,
preaction=
draw,
yellow,
line width=55pt, % Yellow border lines.
,
postaction=
draw,
white,
line width=19pt,
dash pattern=on 35pt off 15pt, % Here control the road division lines
,
postaction=
draw,
way,
line width=18pt,
begindocument
foreach x in 1,...,30 ++(6,-6)node[pos=x/30]includegraphics[scale=0.15]Sprite-police-front;
fi
draw[ultra thick,->,red,rounded corners=1cm]
(0,-3)
ifnumx<16
enddocument
PSD: animation done with imagemagick converter.
answered Aug 25 at 6:51
J Leon V.
6,151528
answered Aug 25 at 6:51
J Leon V.
6,151528
answered Aug 25 at 6:51
J Leon V.
6,151528
answered Aug 25 at 6:51
J Leon V.
6,151528
6,151528
add a comment |Â
add a comment |Â
Â
draft saved
draft discarded
Â
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2ftex.stackexchange.com%2fquestions%2f447622%2fpolice-chasing-with-tikz%23new-answer', 'question_page');
);
Post as a guest
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
1
I would put the cars in
saveboxesand then move them along the paths withdecorations.markings....– marmot
Aug 25 at 2:34
1
You can use reflective paint for the arrows, and then mount steering light sensors on the cars.
– hpekristiansen
Aug 25 at 2:42
@marmot, hpekristiansen: Could you post please a MWE (if it's no problem)?
– current_user
Aug 25 at 2:51
1
why tie your hands drawing complex images in code that at the end generates a vector type image, you can import svg sprites in pdf format using the graphicx package, and take advantage of tikz's parametric abilities to change them and move them, as @marmot suggests, or using nodes in the path.
– J Leon V.
Aug 25 at 3:04
1
I really like the indentation on your source code :)
– cmhughes
Aug 26 at 8:48