3

I have a bunch of SVG images that are made in the following way: there is a “base shape” defined by a bunch of lines arranged in a tree-like fashion, that are cloned mirrored and transformed into a snowflake pattern with SVG’s <use> nodes. Unfortunately some applications do not handle thick lines and <use> nodes well, so I hoped to convert them to a more “simple” form of SVG with Inkscape.

Unfortunately, in their original form Inkscape seem to be unable to do anything with them: Path → Stroke to Path, Path → Object to Path, Path → Union or Path → Combine does not seem to do anything.

I figured out a way to do what I want, but it’s somewhat complicated:

  1. Open SVG in Inkscape;
  2. Save it as EMF;
  3. Open saved EMF;
  4. Select all;
  5. Path → Stroke to Path;
  6. Path → Combine;
  7. Path → Union;
  8. Save as SVG.

This way I end up with an SVG containing a single path like I want. Is there a way to achieve the same result faster?

Inkscape version is 0.92.2 if that matters.

The sample SVG looks like this (I didn’t find a way to insert SVG file as an image):

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="600px" height="600px" viewBox="-110 -110 220 220">
    <defs>
        <g id="primary">
            <line x1="0" y1="0" x2="0" y2="-100" stroke="white" stroke-width="10" stroke-linecap="round"></line>
            <line x1="0" y1="-20" x2="11.335980578361996" y2="-0.36550568466299893" stroke="white" stroke-width="10" stroke-linecap="round"></line>
            <line x1="0" y1="-40" x2="-23.342175588425484" y2="0.42983407834691434" stroke="white" stroke-width="10" stroke-linecap="round"></line>
            <line x1="0" y1="-60" x2="9.715489262346612" y2="-65.60924034092474" stroke="white" stroke-width="10" stroke-linecap="round"></line>
            <line x1="0" y1="-80" x2="-22.326108656091357" y2="-92.88998484255117" stroke="white" stroke-width="10" stroke-linecap="round"></line>
        </g>
        <g id="mirrored">
            <use xlink:href="#primary"></use>
            <use xlink:href="#primary" transform="scale(-1, 1)"></use>
        </g>
    </defs>
    <use xlink:href="#mirrored" transform="rotate(0)"></use>
    <use xlink:href="#mirrored" transform="rotate(45)"></use>
    <use xlink:href="#mirrored" transform="rotate(90)"></use>
    <use xlink:href="#mirrored" transform="rotate(135)"></use>
    <use xlink:href="#mirrored" transform="rotate(180)"></use>
    <use xlink:href="#mirrored" transform="rotate(225)"></use>
    <use xlink:href="#mirrored" transform="rotate(270)"></use>
    <use xlink:href="#mirrored" transform="rotate(315)"></use>
</svg>

Which renders to this (if the renderer understands SVG well):

sample image

  • Have you tried Edit > Clone > Unlink Clone? – Billy Kerr Nov 7 '17 at 8:17
3

The following should accelerate this a bit:

  1. Select everything – Ctrl + A.
  2. Unclone – Shift + Alt + D
  3. Ungroup – Ctrl + Shift + G
  4. Repeat steps 2 and 3 until nothing changes anymore.
  5. Path → Stroke to Path – Ctrl + Alt + C
  6. Path → Union – Ctrl + +
  • Yup, that works. Thank you. Still have to do Path -> Combine before Union though: otherwise on some images union does not work properly. – n0rd Nov 10 '17 at 3:30
  • Still have to do Path -> Combine before Union though – The only possible explanation for this is how you treat overlaps – which you can change. – Wrzlprmft Nov 10 '17 at 6:29
  • I have to repeat steps 2 and 3 a few times and then it works. Thanks! – GumZ Apr 25 '18 at 22:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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