Is this about rendering the SVG files themselves or about rendering the PNG thumbnails of SVG files?

I'm not that well-versed in the vector graphics, so pardon my lack of knowledge. I'd say it is about rendering the SVG files themselves. Check out the old version of the file, before Nux's fixes:

https://upload.wikimedia.org/wikipedia/commons/archive/a/a4/20240615205031%21Map_of_New_York_highlighting_Rockland_County.svg

On my computer it is just completely white (or transparent, since the background is white) with the exception of the little red area near the bottom right corner.

I think the new behavior is standards-compliant, and the old one is incorrect. The file has a <g> element inside a <clipPath> element, which is apparently not allowed: https://developer.mozilla.org/en-US/docs/Web/SVG/Element/clipPath#usage_context (and was never allowed, here's a spec from 2001: https://www.w3.org/TR/SVG10/masking.html#EstablishingANewClippingPath).

Curiously, some other old software renders the map in the incorrect file, which probably explains why the problem wasn't apparent when it was created. I have a few old versions of browsers installed for amusement reasons, and Firefox 3.6 and IE 11 both render it, although Opera 9.64 from the same era does not. A fairly recent Inkscape 1.0.2-2 (e86c870879, 2021-01-15) also renders it.

Another example: https://commons.wikimedia.org/wiki/File:Map_of_Colorado_highlighting_Adams_County.svg

Yeah this is probably true for all those county maps of USA. Seems like a one person did an initial version of them. All with similar clip path. So far I've done NY and Alabama. Alaska was a bit more tricky (not really counties, different names)... I guess I might start with the easy ones so that I get more done sooner.

In any case -- the images didn't work in current browsers too, so there was a bug in SVG itself (like MatmaRex mentioned).

Many SVG maps are rendered incorrectly, for example:

• https://en.wikipedia.org/wiki/List_of_cities_and_counties_in_Virginia
• https://en.wikipedia.org/wiki/List_of_counties_in_Mississippi
• https://en.wikipedia.org/wiki/List_of_counties_in_Maryland
• https://en.wikipedia.org/wiki/List_of_counties_in_Idaho

...

As it has been said before, this seems to be an issue with the files not the thumbnailing service. The upgrade of the service just exposed the issue.

For Tech News, please could anyone propose a clear description of the context for the problem and how editors familiar with SVG can most effectively help?
My best guess is something like this:

If you are familiar with editing SVGs, you can help to fix some files that use invalid syntax, which do not display correctly anymore due to stricter standards in web browsers and due to the recent software library update for our thumbnail system.

• It would be ideal if there was an automated task-listing we could point to, but there doesn't seem to be a reliable category that I can see (beyond erratically tagged files, such as those in https://commons.wikimedia.org/wiki/Category:Invalid_SVG_created_with_Other_tools:Maps_of_Virginia ).
  • Is there any other method that editors can use to find these invalid SVGs, beyond manual browsing?
• Also, is there any documentation (or discussion) onwiki about the specific kinds of syntax errors that are most commonly involved, so that editors could perhaps have tips in mind for what to look for? Or any kind of similar helpful tips.

Thanks.

I think that @Mdann52 is working on a bot to correct all of these files. I saw this linked in some discussion on en.wp: https://commons.wikimedia.org/wiki/Commons:Bots/Requests/Mdann52_bot_2

I already have a bot here: https://github.com/Eccenux/mass-map-USA-county

This is partially manual work because there are sometimes subtle differences in the source files (structural differences, duplicate ids...). So a base SVG file needs cleanup and then it can be parsed for ids.

That said if someone want to contribute by sending me a base SVG along with a mapping of ''element id'' → ''file name'', then I can upload that even tomorrow.

Already done (that is 14 states, but about 700-900 counties, borough and such):

1. Alabama
2. Alaska
3. Arkansas
4. Connecticut
5. Delaware
6. Georgia
7. Hawaii
8. Idaho
9. Illinois
10. Indiana
11. Iowa
12. New_York
13. North_Dakota
14. South_Dakota

There are still 28 states on my todo list:
https://github.com/Eccenux/mass-map-USA-county/tree/main/img/todo

(and I think 3 more I've skipped because they are complicated)

Also, is there any documentation (or discussion) onwiki about the specific kinds of syntax errors that are most commonly involved, so that editors could perhaps have tips in mind for what to look for? Or any kind of similar helpful tips.

Step. 1. The common problems is using something like (g inside clipPath):

<clipPath id="state_clip_path">
<g id="state_outline">
...
</g>
</clipPath>

In US states, this can most often be removed entirely.

Step. 2. There is also <!DOCTYPE svg PUBLIC... that should be remove.

Step. 3. Remove clip-path="url(#state_clip_path)" and <use xlink:href="#state_outline".

Step. 4. Change fill="none" to fill="white" for the main g (the one that had clip-path).

Step. 5. Resize width="6233.5" height="4510.9" so that height is about 1000-1200 px (this is for better SVG viewing).

That's it... BUT the tricky part is that <clipPath> sometimes have to be changed to <defs>. This was true for:

1. Map_of_Alaska.svg → https://github.com/Eccenux/mass-map-USA-county/blob/315469de855929f7ad906896996e8f585a236f7e/img/done/Map_of_Alaska.svg#L3
2. Map_of_Illinois.svg → https://github.com/Eccenux/mass-map-USA-county/blob/315469de855929f7ad906896996e8f585a236f7e/img/done/Map_of_Illinois.svg#L3
3. Map_of_Indiana.svg → https://github.com/Eccenux/mass-map-USA-county/blob/315469de855929f7ad906896996e8f585a236f7e/img/done/Map_of_Indiana.svg#L3

Alaska was also the most tricky one so far.

P.S. If you intend to use my code for uploading files, please send me a quick message on Commons. This will help us coordinate better and speed up our collective efforts for the greater good 😉. Thanks! 😊

@Nux - for info on the county-level maps - I've done Wyoming and was part-way through Wisconsin. I'll carry on working from the back in steps if this helps you out? Or if you otherwise want I'll stop and leave it to you!

I've done yellow tiles in a new batch and it looks much better and uniform to other maps, so... I might re-do previously done states.