title: Connecting centre of ellipses with lines
body: <p>I am trying to connect centre of ellipses with lines. THis is what I have-
  <a href="https://i.stack.imgur.com/JDiDE.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/JDiDE.png" alt="enter image description here"></a></p>
  
  <p>Here is the <code>XAML</code> code-</p>
  
  <pre><code>&lt;Grid x:Name="Main" Background="#FFF9F9F9"&gt;
      &lt;Grid.RowDefinitions&gt;
          &lt;RowDefinition Height="1*"/&gt;
          &lt;RowDefinition Height="8*"/&gt;
          &lt;RowDefinition Height="1*"/&gt;
      &lt;/Grid.RowDefinitions&gt;
  
  
  
      &lt;Grid x:Name="Start" Grid.Row="0" Background="#FF0D3A7C"&gt;         
      &lt;/Grid&gt;
      &lt;Grid x:Name="End" Grid.Row="2" Background="#FF0D3A7C"&gt;            
      &lt;/Grid&gt;
  
      &lt;Grid x:Name="Game" Grid.Row="1" Background="#FF0D3A7C"&gt;
          &lt;Grid.RowDefinitions&gt;
              &lt;RowDefinition Height="*" /&gt;
              &lt;RowDefinition Height="*" /&gt;
              &lt;RowDefinition Height="*" /&gt;
          &lt;/Grid.RowDefinitions&gt;
          &lt;Grid.ColumnDefinitions&gt;
              &lt;ColumnDefinition Width="*" /&gt;
              &lt;ColumnDefinition Width="*" /&gt;
              &lt;ColumnDefinition Width="*" /&gt;
          &lt;/Grid.ColumnDefinitions&gt;
  
          &lt;Ellipse Fill="#FFF4F4F5"  Grid.Row="0" Grid.Column="0" Margin="20,20,20,20" Stroke="Black" RenderTransformOrigin="0.474,5.849"/&gt;
          &lt;Ellipse Fill="#FFF4F4F5"  Grid.Row="0" Grid.Column="1" Margin="20,20,20,20" Stroke="Black" RenderTransformOrigin="0.474,5.849"/&gt;
          &lt;Ellipse Fill="#FFF4F4F5"  Grid.Row="0" Grid.Column="2" Margin="20,20,20,20" Stroke="Black" RenderTransformOrigin="0.474,5.849"/&gt;
          &lt;Ellipse Fill="#FFF4F4F5"  Grid.Row="1" Grid.Column="0" Margin="20,20,20,20" Stroke="Black" RenderTransformOrigin="0.474,5.849"/&gt;
          &lt;Ellipse Fill="#FFF4F4F5"  Grid.Row="1" Grid.Column="1" Margin="20,20,20,20" Stroke="Black" RenderTransformOrigin="0.474,5.849"/&gt;
          &lt;Ellipse Fill="#FFF4F4F5"  Grid.Row="1" Grid.Column="2" Margin="20,20,20,20" Stroke="Black" RenderTransformOrigin="0.474,5.849"/&gt;
          &lt;Ellipse Fill="#FFF4F4F5"  Grid.Row="2" Grid.Column="0" Margin="20,20,20,20" Stroke="Black" RenderTransformOrigin="0.474,5.849"/&gt;
          &lt;Ellipse Fill="#FFF4F4F5"  Grid.Row="2" Grid.Column="1" Margin="20,20,20,20" Stroke="Black" RenderTransformOrigin="0.474,5.849"/&gt;
          &lt;Ellipse Fill="#FFF4F4F5"  Grid.Row="2" Grid.Column="2" Margin="20,20,20,20" Stroke="Black" RenderTransformOrigin="0.474,5.849"/&gt;      
      &lt;/Grid&gt;
  
  &lt;/Grid&gt;
  </code></pre>
  
  <p>Now I want to connect a <code>line</code> or <code>checkbox</code> from centre of each ellipse to all the ellipses using <code>C#</code>. Basically I will have a button and upon clicking it, I want all the lines to appear. I am new to app development and am not sure how to go about it. </p>
  
  <p><strong>Edit-</strong>
  Basically I want to connect the centres of each nodes to all the rest. THis is similar to the following figure where I have done it for the first node manually-</p>
  
  <p><a href="https://i.stack.imgur.com/rr4GY.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/rr4GY.png" alt="enter image description here"></a></p>