1

I drew a very simple SVG in Inkscape, it generates a normal Svg xml file, but it opens as blank in any browser. I saved it as an optimized svg. The <svg></svg> tag has the right size which is about 120x240, but the <g></g> tag has zero width and height. I saved it with as many different optimized options as possible. but no success, here is the markup.

<?xml version="1.0" encoding="UTF-8"?>
<svg width="1.28in" height="2.5in" version="1.1" viewBox="0 0 122.88 240" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
 <metadata>
  <rdf:RDF>
   <cc:Work rdf:about="">
    <dc:format>image/svg+xml</dc:format>
    <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
    <dc:title/>
   </cc:Work>
  </rdf:RDF>
 </metadata>
 <g transform="translate(-54.914 -9.4701)" fill="none" stroke="#5700f9" stroke-linecap="round">
  <circle d="M 137.45269,41.625808 A 35.989323,37.483715 0 0 1 120.99146,83.17476 35.989323,37.483715 0 0 1 78.080432,78.398937 35.989323,37.483715 0 0 1 70.420364,34.165382 35.989323,37.483715 0 0 1 109.02549,14.076485" stroke-width="8.008"/>
  <circle d="m 119.48537,50.184303 a 15.657769,14.677526 0 0 1 -3.32089,13.254139 15.657769,14.677526 0 0 1 -13.51181,4.993754" stroke-width="9.2071"/>
  <circle d="m 127.91845,23.186448 a 9.1428576,9.1428576 0 0 1 -0.003,-3.7e-4" stroke-width="9.204"/>
  <circle d="m 170.83949,139.71945 a 26.628351,27.413614 0 0 1 -36.53648,8.4993 26.628351,27.413614 0 0 1 -8.64349,-37.52152 26.628351,27.413614 0 0 1 36.35284,-9.29647 26.628351,27.413614 0 0 1 9.41584,37.32401" stroke-width="6.4779"/>
  <circle transform="matrix(.857 -.51532 -.51532 -.857 0 0)" d="m 57.491566,-191.59818 a 9.991559,9.4798365 0 0 1 7.78685,-0.57415 9.991559,9.4798365 0 0 1 5.843214,4.91705" stroke-width="7.69"/>
  <circle d="m 93.713105,121.92826 a 18.186472,18.138155 0 0 1 -10.183359,23.27493 18.186472,18.138155 0 0 1 -23.53523,-9.69045 18.186472,18.138155 0 0 1 9.24531,-23.66116 18.186472,18.138155 0 0 1 23.903723,8.74738" stroke-width="7.251"/>
  <circle d="m 165.70449,187.24282 a 18.586807,18.586807 0 0 1 -10.40766,23.85055 18.586807,18.586807 0 0 1 -24.05324,-9.93024 18.586807,18.586807 0 0 1 9.44888,-24.24638 18.586807,18.586807 0 0 1 24.42988,8.96377" stroke-width="7.851"/>
  <circle d="m 112.16029,173.44286 a 9.4280901,9.4280901 0 0 1 -5.27924,12.09811 9.4280901,9.4280901 0 0 1 -12.200924,-5.03708 9.4280901,9.4280901 0 0 1 4.79291,-12.29889 9.4280901,9.4280901 0 0 1 12.391964,4.54684" stroke-width="6.751"/>
  <circle d="m 122.70862,230.11485 a 10.146421,10.146421 0 0 1 -5.68148,13.01987 10.146421,10.146421 0 0 1 -13.13051,-5.42086 10.146421,10.146421 0 0 1 5.15808,-13.23595 10.146421,10.146421 0 0 1 13.33612,4.89327" stroke-width="7.251"/>
 </g>
</svg>

P.S.: I did not draw outside the canvas.

4
  • If you try to open this text file (not the original svg saved in Inkscape) in Inkskape does it work? Does the originally in Inkscape saved svg work if opened in Inkscape?
    – user287001
    Mar 26 at 7:33
  • Yes, to both of those questions! Mar 26 at 11:58
  • How was your SVG generated? To be honest those aren't SVG Circles at all. These should be in a format like this: <circle cx="55.5" cy="92.5" r="23.9"/>. What you there are paths with the wrong SVG element. Should be <path> not <circle>. Not sure how you got there. I can't replicate this in Inkscape, drawing simple circles, and exporting as optimised.
    – Billy Kerr
    Mar 27 at 1:59
  • I drew arcs normally. Adding circles and dragging them from the inside. Mar 27 at 3:01
1

I managed to do it after scouring youTube for answers. I have no Idea why it works, but I had to convert all objects to paths. Path > Objects to path (in the top bar)

Then save it as an optimized .svg with the default settings.

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.