comprimento de rotulagem de conceito de rotulagem de segmento tikz

Question

Acabei de ler uma pergunta sobre rotular o comprimento do segmento, mas é muito difícil para mim, pois todas as perguntas anteriores usam um ângulo para rotular o comprimento/distância e não entendi o conceito. Alguém poderia me ensinar sobre o conceito de rotular o comprimento do segmento?

Darei meu experimento e um problema que preciso para descrevê-lo no TikZ.

Aqui está o código que eu tentei:

\begin{tikzpicture}
\tikzset{
mydot/.style={
fill,
circle,
inner sep=1.5pt
}
}
\path (0:4.5) coordinate (A) (0:1.5) coordinate (B) (0:0) coordinate (C);
\draw (A)
-- (B) node [midway, above]{$x$} -- (C) node [midway, above]{$y$}  -- (A) -- cycle;
\node[mydot,label={below left:$A$}] at (A) {};
\node[mydot,label={below left:$B$}] at (B) {};
\node[mydot,label={below left:$C$}] at (C) {};
\draw[|<->|] ($(A)!5mm!90:(C)$)--node[fill=white] {$z$} ($(C)!5mm!0:(A)$);
\end{tikzpicture}

Na verdade, copiei esse código da pergunta postada anteriormente, mas organizei-o para o meu caso aqui.

Aqui está a imagem recortada do problema que eu queria descrever no TikZ

A propósito, eu gostaria que o segmento fosse horizontal. Obrigada então.

Answer 1

Algo assim

\begin{tikzpicture}
\tikzset{
    mydot/.style={
        fill,
        circle,
        inner sep=1.5pt
    }
}
\coordinate  (A) at(0,0) ;
\coordinate  (B)  at (3,0);
\coordinate  (C) at (6,0);
\coordinate  (D) at (9,0);
% (3,0) coordinate (B) (6,0) coordinate (C) (9,0) coordinate (D);
\draw (A) -- node [midway, above]{\scriptsize $x=21-14$}
(B)  -- node [midway, above]{\scriptsize $y=13-x$}
(C)   -- 
(D);
\node[mydot,label={below left:$A$}] at (A) {};
\node[mydot,label={below left:$B$}] at (B) {};
\node[mydot,label={below left:$C$}] at (C) {};
\node[mydot,label={below left:$D$}] at (D) {};
\draw[|<->|,red,line width=1pt] ($(A)!10mm!-90:(C)$)--node[fill=white] {$13$} ($(C)!10mm!90:(A)$);
\draw[|<->|,blue,line width=1pt] ($(B)!15mm!-90:(D)$)--node[fill=white] {$14$} ($(D)!15mm!90:(B)$);
\draw[|<->|,green,line width=1pt] ($(A)!20mm!-90:(D)$)--node[fill=white] {$21$} ($(D)!20mm!90:(A)$);
\end{tikzpicture}

editar - rótulo acima do segmento

\begin{tikzpicture}
\tikzset{
    mydot/.style={
        fill,
        circle,
        inner sep=1.5pt
    }
}
\coordinate  (A) at(0,0) ;
\coordinate  (B)  at (3,0);
\coordinate  (C) at (6,0);
\coordinate  (D) at (9,0);
% (3,0) coordinate (B) (6,0) coordinate (C) (9,0) coordinate (D);
\draw (A) -- node [midway, above]{\scriptsize $x=21-14$}
(B)  -- node [midway, above]{\scriptsize $y=13-x$}
(C)   -- 
(D);
\node[mydot,label={below left:$A$}] at (A) {};
\node[mydot,label={below left:$B$}] at (B) {};
\node[mydot,label={below left:$C$}] at (C) {};
\node[mydot,label={below left:$D$}] at (D) {};
\draw[|<->|,red,line width=1pt] ($(A)!10mm!90:(C)$)--node[fill=white] {$13$} ($(C)!10mm!-90:(A)$);
\draw[|<->|,blue,line width=1pt] ($(B)!15mm!90:(D)$)--node[fill=white] {$14$} ($(D)!15mm!-90:(B)$);
\draw[|<->|,green,line width=1pt] ($(A)!20mm!90:(D)$)--node[fill=white] {$21$} ($(D)!20mm!-90:(A)$);
\end{tikzpicture}

Answer 2

Editar: Considerado comentário de @jsbibra.

Assim:

\documentclass[tikz, margin=3mm]{standalone}
\usetikzlibrary{arrows.meta,
                positioning,
                quotes}
\usepackage{amsmath}


\begin{document}
    \begin{tikzpicture}[x=7mm,
dot/.style = {circle, fill, inner sep=1.5pt,
              label=#1,
              node contents={}},
arr/.style = {{Bar[width=3mm].Straight Barb[]}-{Straight Barb[].Bar[width=3mm]},
              shorten >=-0.5\pgflinewidth, shorten <=-0.5\pgflinewidth,
              very thin},
every edge quotes/.style = {font=\small, auto=center}
                        ]
\node (a) [dot=${A=0}$];
\node (b) [dot=$B$, right= 7 of a];
\node (c) [dot=${C=13}$, right=13 of a];
\node (d) [dot=${D=21}$, right=21 of a];
%
\draw (a) to["${\begin{aligned}
                \overline{AB} & = \overline{AD}-\overline{BD}\\
                              & = 21-14=\color{red}7
                \end{aligned}}$"]   (b)
          to["${\begin{aligned}
                \overline{BC} & = \overline{AC}-\overline{AB}\\
                              & = 13-7=\color{red}6
                \end{aligned}}$"]   (c)   -- (d);
% aux coordinate and dimension BD
\coordinate[below=6mm of b] (b1);
\draw[arr]  (b1) to ["${\overline{BD} = 14}$" fill=white]  (b1-|d);
\end{tikzpicture}
\end{document}