title: SwiftUI: Wedge shape with inner stroke
body: <p>I’m trying to make a chart like the one pictured.</p>
  
  <p><a href="https://i.stack.imgur.com/14zms.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/14zms.png" alt="enter image description here"></a></p>
  
  <p>The code below is fine, but I'd really like the border of each wedge drawn with an inner stroke (instead of centered):</p>
  
  <pre><code>import SwiftUI
  
  struct WedgeShape: Shape {
      var startAngle: Angle
      var endAngle: Angle
  
      func path(in rect: CGRect) -&gt; Path {
          var p = Path()
  
          p.addArc(
              center: CGPoint(x: rect.size.width/2, y: rect.size.width/2),
              radius: rect.size.width/2,
              startAngle: startAngle,
              endAngle: endAngle,
              clockwise: false
          )
  
          return p
      }
  }
  
  struct Wedge {
      var startAngle: Double
      var endAngle: Double
      var color: Color
  }
  
  struct ContentView: View {
      var wedges = [
          Wedge(startAngle: 0, endAngle: 90, color: Color.red),
          Wedge(startAngle: 90, endAngle: 180, color: Color.green),
          Wedge(startAngle: 180, endAngle: 360, color: Color.blue)
      ]
  
      var body: some View {
          ZStack {
              ForEach(0 ..&lt; wedges.count) {
                  WedgeShape(
                      startAngle: Angle(degrees: self.wedges[$0].startAngle),
                      endAngle: Angle(degrees: self.wedges[$0].endAngle)
                  )
                  .stroke(self.wedges[$0].color, lineWidth: 44)
              }
          }
      }
  }
  </code></pre>
  
  <p>I know I could simply adjust the view's frame to account the stroke. However, I want something like <code>Circle().strokeBorder(Color.green, lineWidth: 44)</code> where the stroke is already accounted for. The <code>InsettableShape</code> protocol looks like it could be helpful for this, but I'm not sure how to use the <code>inset(by:)</code> method.</p>