☰

警察用 TikZ 追捕

tag-icon • tag-icon tikz-pgf animations
警察用 TikZ 追捕

考虑以下 MWE：

\documentclass[border=5pt,tikz]{standalone}
\usetikzlibrary{intersections,snakes}
\tikzstyle{water} = [decorate,decoration={zigzag,segment length=3mm,amplitude=.5mm}]
\definecolor{police}{RGB}{27,128,196}
\definecolor{sirene}{RGB}{240,79,35}
\definecolor{windows}{RGB}{189,230,250}
\definecolor{tire}{RGB}{121,131,140}
\definecolor{mark}{RGB}{246,235,21}
\definecolor{star}{RGB}{242,103,34}
\definecolor{street}{RGB}{46,46,46}
\definecolor{forest}{RGB}{34,139,34}
\definecolor{deep}{RGB}{31,61,12}
\definecolor{aqua}{RGB}{107,202,226}
\tikzset{
    pentagon/.style={
        append after command={
            \pgfextra{
                \begin{scope}[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;
                \end{scope}
            }
        }
    },
    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{
                \begin{scope}[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;
                \end{scope}
            }
        }
    }
}
\begin{document}
    \begin{tikzpicture}
        \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);
        \begin{scope}[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);
            }
        \end{scope}
        \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);
    \end{tikzpicture}
\end{document}

输出如下：

截屏

我的问题是：我怎样才能让赛车沿着箭头移动，以便警官抓住赛车手？

答案1

这是第一个版本。我不知道圆角对切线斜率有如此大的影响。我的错，已经修复了

\documentclass[border=5pt,tikz]{standalone}
\usetikzlibrary{intersections,snakes,decorations.markings,calc,shapes.geometric}
\tikzset{water/.style={decorate,decoration={zigzag,segment
length=3mm,amplitude=.5mm}}}
\definecolor{police}{RGB}{27,128,196}
\definecolor{sirene}{RGB}{240,79,35}
\definecolor{windows}{RGB}{189,230,250}
\definecolor{tire}{RGB}{121,131,140}
\definecolor{mark}{RGB}{246,235,21}
\definecolor{star}{RGB}{242,103,34}
\definecolor{street}{RGB}{46,46,46}
\definecolor{forest}{RGB}{34,139,34}
\definecolor{deep}{RGB}{31,61,12}
\definecolor{aqua}{RGB}{107,202,226}
\tikzset{
    pentagon/.style={
    shape=star, star points=5, star point ratio=1.9, draw,minimum
width=3mm,fill=#1}}
\newsavebox\PoliceCar
\sbox\PoliceCar{\tikz{
                \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) {};
            }
        }
\newsavebox\Racer
\sbox\Racer{\tikz{\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=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;
            }
}
\begin{document}
\foreach \X in {0,0.03,...,0.9}
    {\begin{tikzpicture}
        \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);
        \begin{scope}[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);
            }
        \end{scope}
        \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);
        \path[use as bounding box] (current bounding box.south west) rectangle
         (current bounding box.north east);
        \draw[xshift=.7cm,ultra thick,blue,opacity=.7,->,rounded corners=5mm,
        postaction={decorate,decoration={markings,mark=at position 1.1*\X
        with {\path (-10pt,0) coordinate(tmp1) (10pt,0) coordinate(tmp2);
        \pgftransformreset
        \draw let
        \p1=($(tmp2)-(tmp1)$),\n1={atan2(\y1,\x1)} in 
         (tmp1)   node[rotate=\n1] {\usebox\PoliceCar};}}}] 
         (5,-2) -|  (9,-6);
        \draw[xshift=.7cm,ultra thick,red,opacity=.7,->,rounded corners=5mm,
        postaction={decorate,decoration={markings,mark=at position \X
        with {\path (-1pt,0) coordinate(tmp1) (1pt,0) coordinate(tmp2);
        \pgftransformreset
        \path let \p1=($(tmp2)-(tmp1)$),\n1={atan2(\y1,\x1)} in 
         (tmp1) node[rotate=\n1] {\usebox\Racer};}}}] 
         (-.5,-5.2) |- (9,-6.1);
    \end{tikzpicture}}
\end{document}

在此处输入图片描述

答案2

只是为了好玩，并表达我的观点，我使用回收的代码来绘制道路绘制街道曲线，然后在包含图像的路径中定位节点，在这种情况下，图像转换为 svg，在 inkscape 中编辑并导出为 pdf 格式，您可以在我的驾驶，一直可用直到大 G 消失，由 4 个精灵组成，每个汽车 2 个，我在某个帧中交替显示。

结果： 在此处输入图片描述

MWE：要运行，您需要将 pdf 文件Sprite-police-side.pdf、、、或任何 tikz pdf 输出Sprite-police-front.pdf、inkscape pdf 输出等下载到保存主 .tex 文件的文件夹。Sprite-car-front.pdfSprite-car-side.pdf

% arara: pdflatex: {synctex: yes, action: nonstopmode}
% arara: animate: {density: 100, delay: 13, other: -background white -alpha remove}
% arara: showanimate
\documentclass[tikz,border=20pt]{standalone}
\usetikzlibrary{arrows,positioning,backgrounds,patterns}
\definecolor{grass}{HTML}{296402}
\definecolor{way}{HTML}{373737}
\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,
        }
    }
}
\begin{document}
    \foreach \x in {1,...,30}{
    \pagecolor{grass}
    \begin{tikzpicture}
    %Runways
    \draw[runway node]
    (0,0) rectangle ++(12,-12)
    (0,-6) -- ++(12,0)
    (6,-6) -- ++(0,6);
    \draw[pattern=horizontal lines light blue,rounded corners=10pt] (1.5,-4.5) rectangle (4.5,-1.5) ;
    \draw[ultra thick,->,blue,rounded corners=1cm]
    (6,0)
            \ifnum\x<14
                -| ++(6,-6)node[pos=\x/30]{\includegraphics[scale=0.12]{Sprite-police-side}};
            \else
                -| ++(6,-6)node[pos=\x/30]{\includegraphics[scale=0.15]{Sprite-police-front}};
            \fi
    \draw[ultra thick,->,red,rounded corners=1cm]
    (0,-3)
            \ifnum\x<16
                |- ++(12,-3)node[pos=\x/30]{\includegraphics[scale=0.15]{Sprite-car-front}};
            \else
                |- ++(12,-3)node[pos=\x/30]{\includegraphics[scale=0.12]{Sprite-car-side}};
            \fi

    \end{tikzpicture}
    }
\end{document}

PSD：动画使用 imagemagick 转换器完成。

相关内容