'React Native: How to make height of custom SVG icon match React Native Vector Icon?

In my React Native app I have an icon from react-native-vector-icons like this:

<Icon
    name="ios-options"
    size={36}
    color='black'
/>

and an SVG icon from a file that I import with import FilterCircle from '@images/filter-circle.svg'; and then render with <FilterCircle/>.

The problem is, if I try to make their sizes match with <FilterCircle size={36}/>, the FilterCircle SVG doesn't appear. The only way I can make it appear is by giving it explicit dimensions with <FilterCircle width={100} height={100}/>.

How can I make the FilterCircle SVG match the size of the ios-options <Icon>?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source