GraphiteEditor
Importing SVG gradients with userSpaceOnUse
We don't currently handle importing SVGs with gradientUnits="userSpaceOnUse".
Relevant code: https://github.com/GraphiteEditor/Graphite/blob/41288d7642bae17d3da13670dc9fed50ca656cfd/editor/src/messages/portfolio/document/graph_operation/graph_operation_message_handler.rs#L399-L400
Sample svg:
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="174" height="174" viewBox="0,0,174,174"><defs><radialGradient cx="240" cy="180" r="87" gradientUnits="userSpaceOnUse" id="color-1"><stop offset="0" stop-color="#ffffff"/><stop offset="1" stop-color="#000000"/></radialGradient></defs><g transform="translate(-153,-93)"><g data-paper-data="{"isPaintingLayer":true}" fill="url(#color-1)" fill-rule="nonzero" stroke="#000000" stroke-width="0" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" style="mix-blend-mode: normal"><path d="M153,180c0,-48.04877 38.95123,-87 87,-87c48.04877,0 87,38.95123 87,87c0,48.04877 -38.95123,87 -87,87c-48.04877,0 -87,-38.95123 -87,-87z"/></g></g></svg>
A test that this works properly would also be greatly appreciated.
Seems like the sample SVG was able to be imported without any issues. Can you please elaborate on the expected behavior?
I'd also appreciate if you could point to some documentation on UserSpaceOnUse
@KartikSharma0 The issue is with importing SVG files. Not PNGs. This is clearly stated in the issue title: «Importing SVG…». You have to press import and then select a SVG file. Do not select a PNG file.
If you actually import the SVG file, you will see that the gradient is broken and the circle is all black.
It is very easy to search on the internet for documentation on gradientUnits="userSpaceOnUse" in SVG files. I do not feel it is beneficial for me to do it for you.
I hope that resolves your query.
@0HyperCube Thank you for correcting me on how to reproduce the issue.