Commons:Graphics village pump/August 2022

Objects dropped in SVG to PNG after simple mod

• 
  Grabado de la Fundación de México.svg
• 
  Atl-tlachinolli Aztec symbol of war.svg missing circles in red band; missing one u

I removed objects and cleaned Grabado de la Fundación de México.svg to make Atl-tlachinolli Aztec symbol of war.svg in Inkscape 1.2.1, and while the features in the new file ("Atl-tlachinolli...") look ok in the SVG, all the PNG previews leave out or mis-z-layer a bunch of the objects in a rather odd way (Only one object path is specified, then cloned N times, so why would this rendering have only two of the little red circle details be in the top layer?) If someone could fix or tell me how to fix this, I would appreciate it. SamuelRiv (talk) 01:17, 11 August 2022 (UTC)

@SamuelRiv:

Phab:T276684 ("direct clone of a element not displayed")

The group with id="g3912" displays, the clone of the group with id="use3916" displays, but the clone of the clone with id="use3918" does not. The remaining items clone the non-displaying clones.

      <g
         id="g3912">
        <circle
           style="fill:#800000;fill-opacity:1;fill-rule:evenodd;stroke:#550000;stroke-width:3;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
           id="path3822"
           transform="translate(2.0032836,1.2019702)"
           cx="727.53259"
           cy="66.445358"
           r="11.332283" />
        <ellipse
           style="fill:#d40000;fill-opacity:1;fill-rule:evenodd;stroke:none"
           id="path3910"
           cx="729.79907"
           cy="67.436928"
           rx="6.5160627"
           ry="6.0911021" />
      </g>
      <use
         height="556"
         width="650"
         transform="translate(1.9831496,22.947874)"
         id="use3916"
         xlink:href="#g3912"
         y="0"
         x="0" />
      <use
         height="556"
         width="650"
         transform="translate(7.3659842,22.097953)"
         id="use3918"
         xlink:href="#use3916"
         y="0"
         x="0" />

Instead of cloning clones, clone the original group.

Glrx (talk) 13:32, 11 August 2022 (UTC)

Thanks, that seems to work. Is there any way to expedite the process or do it through Inkscape, because right now it seems I have to manually go through the text of the svg file and offset each translation with the calculator. I don't see any way to do it in Inkscape, but I'm a novice at the program. Also, is there any reason why it renders fine in the source svg and others in Commons doing the same thing? SamuelRiv (talk) 14:22, 11 August 2022 (UTC)

@SamuelRiv:

I do not know Inkscape, but finding the original clone or unlinking might work

https://www.tutorviacomputer.com/inkscape/create-clones

Glrx (talk) 14:29, 11 August 2022 (UTC)

Also it hardly seems sustainable. Taking a simple parent object, if subsequent children pile on transformation after transformation, the size of the svg file would quickly become unwieldy and the usefulness of cloning itself would quickly diminish. So it just seems like a weird bug. SamuelRiv (talk) 14:41, 11 August 2022 (UTC)

It's a bug, but the bug has been fixed. The problem is WMF is running code that is essentially 4 years old. Consequently, many users keep running into bugs that were fixed long ago but not yet merged into MediaWiki. See Commons:Commons SVG Checker. Glrx (talk) 14:52, 11 August 2022 (UTC)

So the best/easiest thing to do is just wait for WM to update librsvg it would seem. SamuelRiv (talk) 15:47, 11 August 2022 (UTC)

If you believe in exponential distributions and you believe you've made a random sample, then you would expect WMF to update librsvg four years from now. Not exactly appetizing.

There is some hope for a quicker change, but WMF has delayed updates for so long that many problems now need to be fixed.

So I would fix or workaround many WMF librsvg bugs. I draw the line at some bugs, but usually getting something to work now is the more important goal.

For this case, I would only clone the original group rather than cloning clones. Fundamentally, that is a more sensible way to draw the image in the first place. However, Inkscape makes it easy to clone clones, gives no warning about a better approach, so many graphic artists clone clones rather than clone originals. It's messy, but it should work.

Glrx (talk) 16:14, 11 August 2022 (UTC)

I'm no graphics designer and I've never messed with a rendering engine, but from a theoretical perspective it doesn't seem clear to me why recursively cloning clones would be fundamentally better or worse than iteratively cloning the original, and SVG/CSS doesn't seem to have any file size overhead in either case in this example at least. (And if this is off topic here, I'll drop it.) SamuelRiv (talk) 17:16, 11 August 2022 (UTC)

There are subtle issues and reasons. Perhaps the simplest is consider deleting just one of the circles. Deleting a cloned circle means there is nothing left for any clones of that clone. What happens to the clones of the deleted clone? It is far cleaner to have a pristine model in the defs section (i.e., it is never displayed) and to clone that model as many times as needed. Deleting a single clone has no ramifications. Glrx (talk) 18:53, 11 August 2022 (UTC)

Adding translations to multilingual SVGs

Is there a page here at Commons you could link me to that gives a step-by-step how to add new language text to an SVG image? Ideally, it should be suitable for someone without strong image manipulation skills (like me).

The backstory here is the conversion of a French history timeline png (here) to English at the Commons:Graphic Lab/Illustration workshop, in which User:Glrx has kindly created an SVG version, which, if I understand correctly, can support not only French and English, but other languages going forward as well.

I know a few languages, and could probably add two or three more to the SVG, if I knew how to do it. Is there a page here at Commons that explains how to do this? Or is this more of an expert skill for Photoshop users, or similar? I'm willing to learn a new tool, if it's easy. (ping, please) Thanks, Mathglot (talk) 21:28, 15 August 2022 (UTC)

@Mathglot:

See Commons:SVG Translate tool. The user interface is pretty simple.

Here's a direct link to the tool for File:Chronologie_constitutions_françaises.svg:

• https://svgtranslate.toolforge.org/File:Chronologie_constitutions_françaises.svg

You can try it out, but please don't save that file to Commons until the librsvg display issues have been worked out.

Also, a tip. Do not translate strings such as "1780" that are the same in Latin languages.

The tool should be OK to use for SVG files generated by hand or with Inkscape, but it may not be appropriate for other graphics applications. For example, Adobe Illustrator may not be able to edit multilingual SVG files. When AI reads the file, it may discard all the translations.

Glrx (talk) 22:06, 15 August 2022 (UTC)

@Glrx: , thanks for the link. I won't make any changes until you give me the green light. Thanks again, Mathglot (talk) 22:32, 15 August 2022 (UTC)