title: React Native svg clip path on image not working
body: <p>Trying to clip an Image component with an svg ClipPath is proving problematic. I can clip a Rect no problem, but when I replace the Rect with an Image, nothing shows up. </p>
  
  <pre><code>octogon.points = "80,0.3 23.6,23.6 0.3,80 23.6,136.4 80,159.7 136.4,136.4 159.7,80 136.4,2 3.6";
  
  props.photoUri = "file:///data/user/0/host.exp.exponent/cache/ExperienceData/%2540anonymous%252Fhalt-c46ef35c-1897-441e-840e-28147c0de5a9/ImagePicker/d68a7ddd-807e-4d26-95c2-bd47ddca803e.jpg"
  
  &lt;View style={styles.container}&gt;
      &lt;Svg width={160} height={160} viewBox={`0 0 160 160`}&gt;
          &lt;Defs&gt;
              &lt;ClipPath id="clip"&gt;
                  &lt;Polygon points={octogon.points} /&gt;
              &lt;/ClipPath&gt;
          &lt;/Defs&gt;
          {/* &lt;Rect x="0" y="0" width="160" height="160" fill="red" clipPath="#clip" /&gt; */}
          &lt;Image x="0" y="0" width="160" height="160" source={{ uri: props.photoUri }} clipPath="#clip" /&gt;
      &lt;/Svg&gt;
  &lt;/View&gt;
  </code></pre>
  
  <p>The commented out Rect worked as intended and creates a red octogon. The Image returns blank.</p>
  
  <p>I feel like I'm overlooking something simple. Any help is appreciated. </p>