We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
I'm trying to create a circle with a beautiful gradient, for use as a colour picker.
I found this magnificent solution on StackOverflow done in pure SVG (quite cleverly) but I'm unable to get it to work using this library.
I keep getting an error which states:
Unable to parse color from string "url(#linearA)"
My code is as follows:
<Svg width="300" height="300"> <Defs> <LinearGradient id="linearA" x1="0" y1="0" x2="1" y2="1"> <Stop offset="0%" stop-color="#01E400"></Stop> <Stop offset="100%" stop-color="#FEFF01"></Stop> </LinearGradient> <LinearGradient id="linearB" x1="0.5" y1="0" x2="0.5" y2="1"> <Stop offset="0%" stop-color="#FEFF01"></Stop> <Stop offset="100%" stop-color="#FF7E00"></Stop> </LinearGradient> <LinearGradient id="linearC" x1="1" y1="0" x2="0" y2="1"> <Stop offset="0%" stop-color="#FF7E00"></Stop> <Stop offset="100%" stop-color="#FB0300"></Stop> </LinearGradient> <LinearGradient id="linearD" x1="1" y1="1" x2="0" y2="0"> <Stop offset="0%" stop-color="#FB0300"></Stop> <Stop offset="100%" stop-color="#9B004A"></Stop> </LinearGradient> <LinearGradient id="linearE" x1="0.5" y1="1" x2="0.5" y2="0"> <Stop offset="0%" stop-color="#9B004A"></Stop> <Stop offset="100%" stop-color="#7D0022"></Stop> </LinearGradient> <LinearGradient id="linearF" x1="0" y1="1" x2="1" y2="0"> <Stop offset="0%" stop-color="#7D0022"></Stop> <Stop offset="100%" stop-color="#01E400"></Stop> </LinearGradient> </Defs> <Path d="M150 10 a120 120 0 0 1 103.9230 60" fill="none" stroke="url(#linearA)" stroke-width="5" /> <Path d="M253.9230 70 a120 120 0 0 1 0 120" fill="none" stroke="url(#linearB)" stroke-width="5" /> <Path d="M253.9230 190 a120 120 0 0 1 -103.9230 60" fill="none" stroke="url(#linearC)" stroke-width="5" /> <Path d="M150 250 a120 120 0 0 1 -103.9230 -60" fill="none" stroke="url(#linearD)" stroke-width="5" /> <Path d="M46.077 190 a120 120 0 0 1 0 -120" fill="none" stroke="url(#linearE)" stroke-width="5" /> <Path d="M46.077 70 a120 120 0 0 1 103.9230 -60" fill="none" stroke="url(#linearF)" stroke-width="5" /> </Svg>
I haven't put very much effort into finding the problem, but could it be because ART is using extractColor instead of extractBrush for strokes?
extractColor
extractBrush
The text was updated successfully, but these errors were encountered:
This feature need ART support. Sorry, can`t help you with this right now.unless official support is landed on ART.
Sorry, something went wrong.
Im working on it now. The react-native-art-svghas changed name toreact-native-svg`. And it is no longer rely on ReactNativeART any more.
m working on it now. The
has changed name to
It has been fixed on react-native-svg@1.1.0.
No branches or pull requests
I'm trying to create a circle with a beautiful gradient, for use as a colour picker.
I found this magnificent solution on StackOverflow done in pure SVG (quite cleverly) but I'm unable to get it to work using this library.
I keep getting an error which states:
My code is as follows:
I haven't put very much effort into finding the problem, but could it be because ART is using
extractColor
instead ofextractBrush
for strokes?The text was updated successfully, but these errors were encountered: