1

I've been encouraged to move to a vector-based package like Inkscape to achieve better scalability in my images, but when I display a well-formed SVG spec with a set of Bezier curves in Inkscape I get a very perverse rendering compared to what both GIMP and Microsoft Edge show me.

My image is essentially a collection of parallel S-curves. An indicative section of my SVG spec showing a few of these curve specs is:

<svg
 version="1.1"
 width="2400"
 height="1296"
 viewbox="-320 1 2000 1296"
 xmlns="http://www.w3.org/2000/svg">
... ...

(for some reason, code was not completely displayed in my original post -- here are some relevant Bezier specs)




...



Displayed in GIMP, I get what I expect:

enter image description here

Likewise in Edge (the bottom is cropped in the image, but appears with scrolling)

enter image description here

But if import into Inkscape, I get the following:

enter image description here

Anyone have any idea what is going on here? I've tried adjusting the stroke width, to no avail. Shouldn't matter anyway, as there is no overlap. It seems to me that even if the curves were rendered a little differently in Inkscape, the strictly parallel nature of their specs should keep them spaced. And what's with the black, anyway?

I'm new to Inkscape, so any help would be appreciated.

All right. svgshare.com is "over quota", and I cannot seem to insert the code directly, so here is a picture of a piece of the spec including everything except most of the paths, followed by its display in Inkscape. I think you can see there is no indication of black in the spec. I can change the fill to scarlet, and the image is the same, so the black does not appear to have anything to do with fill. The more disturbing part is the partial disappearance of the colored lines specified in the path declarations.

[abridged svg spec][4] enter image description here Incidentally, if I just include foo.svg as an image into this post, it tries to display as I would expect, except that the inclusion is ultimately not accepted as a proper image type. better sample

9
  • <path d="M 180 0001 Q 240 0216, 80 0432 Q -70 0648, 40 0864 Q 140 1080, -30 1296 " stroke="limegreen" /> <path d="M 188 0001 Q 248 0216, 88 0432 Q -62 0648, 48 0864 Q 148 1080, -22 1296 " stroke="indigo" /> <path d="M 204 0001 Q 264 0216, 104 0432 Q -46 0648, 64 0864 Q 164 1080, -6 1296 " stroke="teal" /> Aug 7, 2022 at 21:45
  • Hi. Welcome to GDSE. This is just a guess. It looks like you have a black fill somewhere. In the DEFs or in a group perhaps? Try removing the fill. It would be better if you could share the entire SVG if you want us to examine it. Try SVGshare.com
    – Billy Kerr
    Aug 7, 2022 at 21:50
  • Yes, there's a fill in the group. Try fill="none".
    – Billy Kerr
    Aug 7, 2022 at 23:59
  • 1
    Hi you see SVG internet colors hierarchically so your object inherent fill color from group they are in , Inkscape does not recognize fill:transparent, as a valid fill typ and it adds defoult fill wich is black . I cannot find if this deviate from standard and "transparent" value is valid value if so this is inkscape bug. If not this is just outside a standard ikscape defoult color is black and browsers decide to ignore if fill is not valid
    – Adam Belis
    Aug 8, 2022 at 9:14
  • 2
    SVG 1.1 was a self-contained specification where color values were defined, among others, as a list of color keywords. This list did not contain transparent. SVG 2 references other specifications if possible, and color is now only a crossreference to CSS Values and Units Level 3, which does define transparent. Inkscape is just a bit slow to implement the new version.
    – ccprog
    Aug 9, 2022 at 0:28

1 Answer 1

1

After lots of comments, it would appear we now have an answer, more or less! Thanks to the extra info provided by users @ccprog and @AdamBelis

Inkscape doesn't recognise fill="transparent" as a valid attribute in SVG 1.1 - but it is valid in SVG 2. If you use that, then Inkscape will default to an opaque black fill, which is what is causing the problem.

Inkscape is still technically on SVG 1.1 but supports some SVG 2 features, but not all of them. I believe it's still a work in progress according to various forums I've checked.

In your SVG, inside the Group element, you need to change it to fill="none" for it to display properly in Inkscape.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.