Cfrgtkky

I have drawn a graph with three vertices and want to shade the area between the edges following the edges 1 to 3 to 2 to 1. (code below)

The first problem I get is with the curve (in red). Before the curve no problems, the second segment starts in 3 at a different point along the edge of 3. After the curve however in 2 the third segment starts at the position the second segment arrived.

This I could patch by adding a extra position. Still the shading is not at the right position.

documentclass{standalone}

usepackage{tikz}

begin{document}



begin{tikzpicture}[scale=0.6]

tikzstyle{knop}=[circle,minimum size=14,inner sep=0pt,draw]

node[knop] (p1) at (0,1.2) {$1$} ;

node[knop] (p2) at (-1.2,0) {$2$} ;

node[knop] (p3) at (1.2,0) {$3$} ;

%- loop is not a problem

path [fill=lightgray,draw,looseness=6,loop] (p1) to [out=45,in=135] (p1);

%- part shaded area missing

path [fill=lightgray,draw] (p1.south east) to (p3.north west) to (p3) 

    to [out=225,in=-45] (p2) to (p2.north east) to (p1);

%- red line continues at same position?

path [draw=red,very thin] (p1) to (p3) to [out=225,in=-45] (p2) to (p1);

%- paint over to get the nodes right 

%node[knop,fill=white] (p1) at (0,1.2) {$1$} ;

%node[knop,fill=white] (p2) at (-1.2,0) {$2$} ;

%node[knop,fill=white] (p3) at (1.2,0) {$3$} ;

end{tikzpicture}



end{document}

Note: in order to shade an area, you need a continuous path. If you have gaps in your path, then TikZ will only shade the last stretch. This happens in your path

path [fill=lightgray,draw] (p1.south east) to (p3.north west) to (p3) 

    to [out=225,in=-45] (p2) to (p2.north east) to (p1);

Even though this does not seem immediately in ones eye, you effectively do that here since the to operation together with an extended node will draw the path to the pgfpointshapeborder, see p. 1031 of the pgfmanual. That's why I draw the path in the above between explicit anchors, and use the backgrounds library in order not to wipe out parts of the nodes.

This is illustrated in the MWE

documentclass[tikz,border=3.14mm]{standalone}

begin{document}

begin{tikzpicture}[scale=0.6]

tikzset{knop/.style={circle,minimum size=14,inner sep=0pt,draw},

explain/.style={font=sffamily,text width=2cm,anchor=north,anchor=north}}

begin{scope}[local bounding box=TL]

node[knop] (p1) at (0,1.2) {$1$} ;

node[knop] (p2) at (-1.2,0) {$2$} ;

node[knop] (p3) at (1.2,0) {$3$} ;

%- loop is not a problem

path [fill=lightgray,draw,looseness=6,loop] (p1) to [out=45,in=135] (p1);

%- part shaded area missing

path [fill=lightgray,draw=blue] (p1.south east) to (p2.north east) to (p2) 

    to [out=-45,in=225] (p3) to (p3.north west) to (p1);

%- red line continues at same position?

path [draw=red,very thin] (p1) to (p3) to [out=225,in=-45] (p2) to (p1);

end{scope}

node[explain] at (TL.south) {your proposal};

begin{scope}[xshift=4cm,local bounding box=TR]

node[knop] (p1) at (0,1.2) {$1$} ;

node[knop] (p2) at (-1.2,0) {$2$} ;

node[knop] (p3) at (1.2,0) {$3$} ;

%- loop is not a problem

path [fill=lightgray,draw,looseness=6,loop] (p1) to [out=45,in=135] (p1);

%- part shaded area missing

path [fill=lightgray,draw=blue] (p1.south east) to (p3.north west) to (p3) 

to[out=-135,in=-45] (p2) to (p2.north east) to (p1);

%- red line continues at same position?

path [draw=red,very thin] (p1) to (p3) to [out=225,in=-45] (p2) to (p1);

end{scope}

node[explain] at (TR.south) {the problem is symmetric};

%

begin{scope}[yshift=-5cm]

begin{scope}[local bounding box=BL]

node[knop] (p1) at (0,1.2) {$1$} ;

node[knop] (p2) at (-1.2,0) {$2$} ;

node[knop] (p3) at (1.2,0) {$3$} ;

%- loop is not a problem

path [fill=lightgray,draw,looseness=6,loop] (p1) to [out=45,in=135] (p1);

%- part shaded area missing

path [fill=lightgray,draw=blue] (p1.south west) to (p2.north east) to (p2.-45) 

    to [out=-45,in=225] (p3) to (p3.north west) to (p1);

%- red line continues at same position?

path [draw=red,very thin] (p1) to (p3) to [out=225,in=-45] (p2) to (p1);

end{scope}

node[explain] at (BL.south) {anchor inserted};

begin{scope}[xshift=4cm,local bounding box=BR]

node[knop] (p1) at (0,1.2) {$1$} ;

node[knop] (p2) at (-1.2,0) {$2$} ;

node[knop] (p3) at (1.2,0) {$3$} ;

%- loop is not a problem

path [fill=lightgray,draw,looseness=6,loop] (p1) to [out=45,in=135] (p1);

%- part shaded area missing

path [fill=lightgray,draw=blue] (p1.south east) to (p3.north west) to (p3.-135) 

to[out=-135,in=-45] (p2) to (p2.north east) to (p1);

%- red line continues at same position?

path [draw=red,very thin] (p1) to (p3) to [out=225,in=-45] (p2) to (p1);

end{scope}

node[explain] at (BR.south) {anchor inserted};

end{scope}

end{tikzpicture}

end{document}

This shows that the problem is symmetric, as one could have expected. It also shows that you have effectively a gap in your path, but I agree that it is not obvious that you have one rather than two gaps. Somehow TikZ skips over the first gap but not over the second one. Why that is, I don't know.

The MWE also shows how to fix this: add one additional anchor to the path, such that there is no gap.

However, I am wondering if you really want to wipe out parts of the nodes, or in fact attempt to draw something like the following.

documentclass{standalone}

usepackage{tikz}

usetikzlibrary{backgrounds}

begin{document}



begin{tikzpicture}[scale=0.6]

tikzset{knop/.style={circle,minimum size=14,inner sep=0pt,draw,fill=white}}

node[knop] (p1) at (0,1.2) {$1$} ;

node[knop] (p2) at (-1.2,0) {$2$} ;

node[knop] (p3) at (1.2,0) {$3$} ;

begin{scope}[on background layer]

%- loop is not a problem

path [fill=lightgray,draw,looseness=6,loop] (p1) to [out=45,in=135] (p1);

path [fill=lightgray,draw=red,very thin] (p1.center) to  (p3.center) 

    to [out=225,in=-45] (p2.center) to (p1.center);

end{scope} 

end{tikzpicture}

end{document}