Inkscape.org
Beginners' Questions Incorrect drawing of an SVG
  1. #1
    Adam Adam @adamnar
    **

    Hello, I really like the idea of Inkscape and this would be an ideal tool for me if it wasn't so buggy with SVGs. It is so buggy that I cannot use it and have to switch to different software (and there exists no comparable free software). Or maybe it is not buggy and I am doing something wrong instead? If so, please let me know what should I do so that I don't encounter these problems. 

    Here is the description of the most recent problem I had. I have an SVG picture. This picture can be found here: [redacted]

    If I open it using any software other than Inkscape (including browsers, other editors etc.), it looks as intended, here is an export to PNG: [redacted]

    However, if I open it with Inkscape it looks like this in the editor, and exports also like this: [redacted]

    As you can see, there are two issues with it: 1) some paths are completely ignored (my investigation indicates that it has something to do with a css filter on these paths) 2) the lower left corner of the upper rectangular reflection is mangled.

    Unfortunately, this is not the only file which has this kind of issue. Previously when I tried to use Inkscape, with different files from different sources, it also failed to represent SVGs correctly.

    I used the most recent version 1.2.2 (on Windows 10), I tried previous versions (includeing below 1.0), I tried installers, .zip versions, Win32 versions etc., but it is always the same. So, my question is: is Inkscape really buggy or am I doing something wrong and, if the latter, how do I fix these problems?

  2. #2
    Polygon Polygon @Polygon🌶
    **

    I wonder where this file comes from in first place.

    1. Go View->Display Mode->Outline

    2. Take Node Tool to select the "invisible" items with shift and go Filters->Remove Filters - done.

     

    When you´re under the impression Inkscape is unstable I´d go Inkscape´s Preferences->System->Reset Preferences and restart Inkscape.

     

     

  3. #3
    Adam Adam @adamnar
    *

    Thank you for your answer, but this does not help at all.

    1. I don't know what software was it created with, but looking at the source it might have been as well written in a notepad. It looks so terse. 

    2. I don't want to remove the filters! I need them, because this is how the picture was designed by the author and this is how it is supposed to look like.

    3. Even if I didn’t need them, removing filters does not help. I.e. after removing them from menu, the paths still do not show. (I mean, I see you did it somehow, but I tried to follow your instructions and failed.) I mentioned filters, because I found out that Inkscape displays these paths if I remove filters from the SVG source code using notepad. But I am not sure whether this is actually the issue.

    4. Resetting preferences does not solve the issue (as well as reinstalling Inkscape or installing different version).

  4. #4
    Tyler Durden Tyler Durden @TylerDurden

    The filter is poorly written... Actually the entire svg is poorly designed and written. Browsers may render these poor svg files, because they often render plenty of garbage.

    In this case, I'd remove the css filter and use an Inkscape filter or multiple-stop gradient on the circle.

    In the future, I'd look for higher quality svg files.

  5. #5
    Hum Hum @Hum
    **

    The above 2 previous posts are correct.

    I was able to import this into Libre Office and from there, into Inkscape and created the attached svg file

     I also included a screen capture of it ss well as a screen capture from NotePad++. See below

     

    From  Text Editor
  6. #6
    Adam Adam @adamnar

    What does it mean "poorly written"? Does it contain errors? Is it violating the SVG specification?

     

  7. #7
    Tyler Durden Tyler Durden @TylerDurden

    Compare the original and Inkscape created files in a text editor and see the difference.

    The original has crap formatting, indenting and whitespaces are all over the place.

    Further, the drop shadow filter is only used to darken the radial gradient on the circle, which can be done better with another circle and gradient.

    Affinity Designer can display the missing objects, but it tosses the failing filter.

  8. #8
    Aero Aero @Aero◻️

    The only issue with displaying OP's file in Inkscape correctly, is the limited support for filterUnits. Inkscape only supports the default value objectBoundingBox for filterUnits. No support for userSpaceOnUse.

    My attached sample file works fine in Affinity. 
    In Inkscape, use the XML Editor, find the svg:filter, trash the attribute filterUnits in order to display the file correctly.

    Sample code for svg file here:
    https://developer.mozilla.org/en-US/docs/Web/SVG/Element/filter

    Code for FilterUnits userSpaceOnUse found here:
    https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/filterUnits

    Filterunits Userspaceonuse
  9. #9
    Martin Owens Martin Owens @doctormo🌹🧀

    On request to the website administrator about copyright problems, I have removed both the original and any copies of the noted work. This has been done as a preventative action and you should delete any copies you each might have locally to prevent any further copyright problems.

    Sorry about any confusion or inconvenience that this might cause in this thread.