How can I draw 2 arcs where their endpoints are connected?

Good question to theVip Youcine suggests using SVG paths with shared endpoints to connect the two arcs.

Good question to the Vip Youcinesuggests using SVG paths with shared endpoints to connect the two arcs.

you’re exactly right: this is actually a common graphics geometry problem in GDI+ (System.Drawing) — you want to draw a thick, ring-like arc (essentially a sector of a donut).

Let’s walk through how to do this step-by-step.

Goal

You have something like:

GraphicsPath path = new GraphicsPath();
path.AddArc(r, 270, 90);

Now you want:

• Another arc inside (smaller radius).

• Lines at the endpoints connecting the outer and inner arcs.

• A single closed shape (so you can fill it or outline it).

1. Core Concept

To create that ring-like shape, you:

1. Define two rectangles:

   • outerRect for the outer arc.

   • innerRect for the inner arc, slightly smaller.

2. Add the outer arc (clockwise).

3. Add the inner arc (counter-clockwise).

4. Close the figure (to connect endpoints).

2. Working Example

Here’s a complete snippet:

using System;
using System.Drawing;
using System.Drawing.Drawing2D;
using System.Windows.Forms;

public class ArcForm : Form
{
    protected override void OnPaint(PaintEventArgs e)
    {
        base.OnPaint(e);

        e.Graphics.SmoothingMode = SmoothingMode.AntiAlias;

        // Outer arc rectangle
        Rectangle outerRect = new Rectangle(50, 50, 200, 200);

        // Inner arc rectangle (smaller by offset)
        int offset = 20;
        Rectangle innerRect = new Rectangle(
            outerRect.X + offset,
            outerRect.Y + offset,
            outerRect.Width - 2 * offset,
            outerRect.Height - 2 * offset
        );

        float startAngle = 270;
        float sweepAngle = 90;

        using (GraphicsPath path = new GraphicsPath())
        {
            // Outer arc (clockwise)
            path.AddArc(outerRect, startAngle, sweepAngle);

            // Inner arc (counter-clockwise)
            path.AddArc(innerRect, startAngle + sweepAngle, -sweepAngle);

            // Close the figure (connect endpoints)
            path.CloseFigure();

            // Optional fill or outline
            e.Graphics.FillPath(Brushes.SkyBlue, path);
            e.Graphics.DrawPath(Pens.Navy, path);
        }
    }

    [STAThread]
    public static void Main()
    {
        Application.Run(new ArcForm());
    }
}

Explanation

Variations

• To create a different thickness, adjust offset.

• To create multiple ring segments, just repeat with different start/sweep angles.

• You can use GraphicsPath.AddPie() if you want the inner radius = 0 (a wedge).

Bonus Tip: Draw “bordered arcs” easily

If you only need an outline, not a filled area:

Pen thickPen = new Pen(Color.Blue, 20);
e.Graphics.DrawArc(thickPen, outerRect, 270, 90);

But that gives you a stroked path (not a filled band).
The method above (two arcs + fill) gives full shape control.