scour-project / scour

Scour - An SVG Optimizer / Cleaner
Apache License 2.0
770 stars 60 forks source link

Save As Optimised SVG Removes Text #312

Open Lauro235 opened 1 year ago

Lauro235 commented 1 year ago

When I Save As Optimised SVG the text is removed. I have provided some context to help the debugging process. Would appreciate your thoughts on what the problem is, if there is a solution and if not, when one will be tabled for.

Inkscape Version - 1.2.1 (9c6d41e410, 2022-07-14) Windows 11 Home Edition

Scour Version Scour SVG Output Scour Options

If I compare the images they look like this.

Inkscape optimised image Minified with Iconly SVG-Cleaner

Here is the broken code that is outputted.

 <text id="text" transform="matrix(1.0581 0 0 1.0581 1486.5 491.84)" fill="#0f172a"  font-family="Comfortaa" font-size="40px" stroke-width="0" style="shape-inside:url(#rect3496);white-space:pre" xml:space="preserve"/>
 <!--
This is the working code from SVG-Cleaner

  <text xml:space="preserve" transform="translate(1486.48 491.835) scale(1.05805)" style="font-size:40px;font-family:Comfortaa;-inkscape-font-specification:Comfortaa;white-space:pre;shape-inside:url(#a);fill:#0f172a;stroke:#0f172a;stroke-width:0;stroke-linecap:round;stroke-dasharray:none"><tspan x="-1341.772" y="-304.746"><tspan style="-inkscape-font-specification:'Comfortaa, @wght=700';font-variation-settings:'wght' 700">Shapes</tspan></tspan></text>
 -->
JoKalliauer commented 1 year ago

@Lauro235 Could you provide the input-file as SVG, or XML, or TXT ?

Lauro235 commented 1 year ago

Hi Joe, if I understand you, you would like the original SVG code? Sure no problem.

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->

<svg
   width="300mm"
   height="300mm"
   viewBox="0 0 300 300"
   version="1.1"
   id="svg1376"
   inkscape:version="1.2.1 (9c6d41e410, 2022-07-14)"
   sodipodi:docname="project-1.svg"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:svg="http://www.w3.org/2000/svg">
  <sodipodi:namedview
     id="namedview1378"
     pagecolor="#ffffff"
     bordercolor="#000000"
     borderopacity="0.25"
     inkscape:showpageshadow="2"
     inkscape:pageopacity="0.0"
     inkscape:pagecheckerboard="0"
     inkscape:deskcolor="#d1d1d1"
     inkscape:document-units="mm"
     showgrid="true"
     inkscape:zoom="0.38083965"
     inkscape:cx="445.06921"
     inkscape:cy="613.11894"
     inkscape:window-width="1920"
     inkscape:window-height="1010"
     inkscape:window-x="-6"
     inkscape:window-y="-6"
     inkscape:window-maximized="1"
     inkscape:current-layer="layer1"
     showguides="true">
    <inkscape:grid
       type="xygrid"
       id="grid1621" />
    <sodipodi:guide
       position="150.00074,330.84794"
       orientation="1,0"
       id="guide1625"
       inkscape:locked="false" />
  </sodipodi:namedview>
  <defs
     id="defs1373">
    <rect
       x="-1341.7721"
       y="-341.35102"
       width="1368.0298"
       height="157.54662"
       id="rect3496" />
  </defs>
  <g
     inkscape:label="Base_Circle"
     inkscape:groupmode="layer"
     id="layer1">
    <rect
       style="font-variation-settings:'wght' 700;fill:none;stroke:#ffa414;stroke-width:2;stroke-linecap:round;stroke-dasharray:none"
       id="square"
       width="261.92245"
       height="261.92245"
       x="19.038816"
       y="26.671152"
       inkscape:label="square">
      <title
         id="title7589">Outer-square</title>
    </rect>
    <circle
       style="fill:#f0d4cc;stroke:#ffa414;stroke-width:3;stroke-linecap:round;stroke-dasharray:none"
       id="circle"
       cx="150.00005"
       cy="157.63239"
       r="74.25"
       inkscape:label="circle">
      <title
         id="title7583">Base</title>
    </circle>
  </g>
  <g
     inkscape:groupmode="layer"
     id="layer2"
     inkscape:label="Text">
    <text
       xml:space="preserve"
       transform="matrix(1.0580523,0,0,1.0580523,1486.4804,491.83532)"
       id="text"
       style="font-size:40px;font-family:Comfortaa;-inkscape-font-specification:Comfortaa;white-space:pre;shape-inside:url(#rect3496);fill:#0f172a;stroke:#0f172a;stroke-width:0;stroke-linecap:round;stroke-dasharray:none"
       inkscape:label="text"><tspan
         x="-1341.7715"
         y="-304.74618"
         id="tspan7612"><tspan
           style="-inkscape-font-specification:'Comfortaa, @wght=700';font-variation-settings:'wght' 700"
           id="tspan7610">Shapes</tspan></tspan></text>
  </g>
  <g
     inkscape:groupmode="layer"
     id="layer3"
     inkscape:label="Hexagon">
    <path
       sodipodi:type="star"
       style="font-variation-settings:'wght' 700;fill:none;stroke:#60ac7c;stroke-width:0.844178;stroke-linecap:round;stroke-dasharray:none"
       id="hexagon"
       inkscape:flatsided="true"
       sodipodi:sides="6"
       sodipodi:cx="56.002853"
       sodipodi:cy="-73.196716"
       sodipodi:r1="46.436749"
       sodipodi:r2="74.89798"
       sodipodi:arg1="0.52359878"
       sodipodi:arg2="1.0471976"
       inkscape:rounded="0"
       inkscape:randomized="0"
       d="m 96.218257,-49.978342 -40.215404,23.218374 -40.215404,-23.218374 10e-7,-46.436749 40.215404,-23.218369 40.215403,23.21837 z"
       inkscape:transform-center-y="-8.5253402e-06"
       transform="matrix(0,2.3691691,-2.3691691,0,-23.415354,24.952151)"
       inkscape:transform-center-x="-44.361491"
       inkscape:label="hexagon">
      <title
         id="title7587">Middle-shape</title>
    </path>
  </g>
  <g
     inkscape:groupmode="layer"
     id="layer4"
     inkscape:label="Square" />
</svg>
JoKalliauer commented 1 year ago

shape-inside is a CSS feature, not sure if it is also an official SVG-feature.

Minimal SVG (Input)

 <?xml version="1.0" encoding="UTF-8"?>
<svg width="159.58" height="43.378" viewBox="0 0 159.58 43.378" xmlns="http://www.w3.org/2000/svg">
 <defs >
  <path id="rect3496" d="m-1341.8-341.35h1368v157.55h-1368z"/>
 </defs>
 <text transform="matrix(1.058 0 0 1.058 1417 355.9)" x="-1341.77" y="-304.75" fill="#0f172a" font-family="Comfortaa" font-size="40px" stroke="#0f172a" stroke-linecap="round" stroke-width="0" style="shape-inside:url(#rect3496);white-space:pre" shape-inside="url(#rect3496)" xml:space="preserve"/>
</svg>

I assume the problem is the combination of shape-inside:url(#rect3496) with transform="matrix(1.058 0 0 1.058 1417 355.9)"