react-native-svg
react-native-svg copied to clipboard
SVG not rendering correctly
Bug
Hello, the above svg won't render correctly inside a react-native application. The part of the "mugshot" is missing, as you can see here on screenshots:
react-native:
while rendering correctly inside a browser:
The issue has to be related to the clip mask at this part of the svg, the path inside the mask does not render correctly:
<mask xmlns="http://www.w3.org/2000/svg" id="mask1_52834_78905" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="96" y="27" width="35" height="45">
<path d="M124.024 27.7921L104.941 27.1257C100.97 26.9871 97.6382 30.0941 97.4995 34.0654L96.4872 63.0533C96.3485 67.0247 99.4555 70.3566 103.427 70.4952L122.509 71.1616C126.481 71.3003 129.813 68.1933 129.951 64.2219L130.964 35.234C131.102 31.2627 127.995 27.9308 124.024 27.7921Z" fill="white"/>
</mask>
Environment info
iOS & Android
React native version:
v0.66.5
Library version: 14.1.0
react-native-svg-transformer version: 1.3.0
Steps To Reproduce
Try to render the mentioned svg inside a react-native application.