title: Creating a custom chart in React Native using CSS
body: <p>I'm trying to create a 'half donut' chart in React Native, using only CSS. The chart below is what I'm trying to recreate, but the segments are proving difficult.</p>
  
  <p><a href="https://i.stack.imgur.com/BurbK.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/BurbK.png" alt="enter image description here"></a></p>
  
  <p>This is what I've got so far:
  <a href="https://i.stack.imgur.com/6057E.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6057E.png" alt="enter image description here"></a></p>
  
  <p>Using this code:</p>
  
  <pre><code>customChart: {
    width: 200,
    height: 100,
    borderTopLeftRadius: 100,
    borderTopRightRadius: 100,
    borderWidth: 50,
    borderStyle: 'solid',
    borderColor: '#eee',
    borderBottomWidth: 0,
    overflow: 'hidden'
  },
  </code></pre>
  
  <p>I just can't seem to get the segments to work. Any ideas or suggestions will be greatly appreciated.</p>