Page MenuHomePhabricator

Use of SVG nominal size in MMV
Closed, ResolvedPublic

Description

MultimediaViewer of an SVG with a small nominal size looks a bit ridiculous, e.g.

https://www.mediawiki.org/wiki/User:Zven#mediaviewer/File:Nuvola-inspired-terminal.svg

There's a similar complaint at

https://en.wikipedia.org/w/index.php?title=Wikipedia_talk:Media_Viewer&oldid=619257982#How_is_a_user_supposed_to_zoom_an_image.3F

The question I have is whether the nominal size should be used at all. Perhaps SVGs should be displayed as if they were infinitely large raster images, i.e. scaling to some large default size.


Version: unspecified
Severity: normal

Event Timeline

bzimport raised the priority of this task from to Needs Triage.Nov 22 2014, 3:42 AM
bzimport added a project: MediaViewer.
bzimport set Reference to bz69237.
bzimport added a subscriber: Unknown Object (MLST).

Nominal size is indeed a bit funky on a lot of icons.

It'd be ideal if we don't have to special-case this for SVG, but I suspect that's the easiest route -- just use the aspect ratio and be aware of the maximum rendering size.

We have MediaHandler::isVectorized(), which returns true for SVGs only. It is a property of vector images that dimensions given in pixels are arbitrary and ignorable.

This would be trivial to fix (we had to add special handling just to ensure the nominal size is taken into account), but would that really be better? Icons look strange in general, it's the exact same with a PNG icon. (There were suggestions to not load MediaViewer at all for very small images, although that would result in inconsistent behavior.)

With a PNG icon, it will look pixellated when enlarged, which may well be better than having a small image on an enormous field of black. I would have thought an enlarged icon would be relatively uncontroversial -- I only chose it as a more extreme illustration of the point about SVG scaling raised on [[Wikipedia talk:Media Viewer]] by Gwideman. In that case it was a detailed graph in SVG form, with a nominal size of 270x270. If you want to know roughly what voltage a J-type thermocouple will give at 300K, you are much better off at a screen-filling width of say 480px:

https://upload.wikimedia.org/wikipedia/commons/thumb/9/95/Intermediate_temperature_thermocouples_reference_functions.svg/480px-Intermediate_temperature_thermocouples_reference_functions.svg.png

Gilles triaged this task as Medium priority.Nov 24 2014, 2:02 PM
Gilles subscribed.

Mass-removing the Multimedia tag from MediaViewer tasks, as this is now being worked on by the Reading department, not Editing's Multimedia team.

Jdlrobson lowered the priority of this task from Medium to Low.Dec 8 2015, 5:04 PM
Jdlrobson subscribed.

This is really annoying for graphs and such. Small SVG icons might look weird when enlarged, but then there is little reason anyone would want to look at small icons in a lightbox.

This could either be fixed in the thumbnailBeforeProduceHTML hook (which could put some special keyword into the HTML attributes to mark that they can be shown in an arbitrary size), or in GuessedThumbnailInfo which could use canvas size instead of original image size for vector images.

Isarra added subscribers: Isarra, dr0ptp4kt, Paladox.

This also affects HiDPI support, as it evidently results in renders above nominal size not being used for higher resolution displays.

Just came across this task in the GCI descriptions, wondering which size an icon like in the task description would then be displayed, it's not fully clear to me what the expected outcome should be from the discussion – exemplified on the icon above?

It would be fit to the viewport. I don't think anyone really cares about icons, but with maps, graphs, charts, diagrams and the like this is a serious defect.

That'd be a resulting screen from my reading:

image.png (1×2 px, 476 KB)

I'd be cautious with infinite size as it makes SVGs intended for a smaller viewport hard to grasp as well.

That is weird but harmless (and what's the point of looking at icons in a lightbox anyway? They are typically already presented in the article in their intended size.)

In contrast, here's a random map from enwiki in MediaViewer:

mv-svg-map.png (1×1 px, 171 KB)

Not super useful, even on my smallish laptop screen.

Unfortunately I don't think there's a way to reliably determine whether an SVG was intended to be viewed in its nominal size or not.

I don't think these icons should be triggering the media viewer. The image size is known at time of clicking, so why not avoid loading the lightbox when the image is say < 50px width?

I don't think these icons should be triggering the media viewer. The image size is known at time of clicking, so why not avoid loading the lightbox when the image is say < 50px width?

Because SVG image size is a completely arbitrary number that people set to weird values occasionally. (Case in point. Or this or this or this which are less extreme examples but still uncomfortable to make out without zoom.) And sometimes you want to inspect the artwork of an icon and the nominal size is too small for that (like this or this).

Also Media Viewer shows a bunch of other things like file descriptions, provenance and reuse conditions. Also, consistency of user experience - if some thumbnails bring up the lightbox and some don't, that's pretty confusing.

Sorry I missed the SVG context here.

That said, I'd argue that showing small images in media viewer is confusing, but I guess it depends on your use case. If you are an editor i can see that as being interesting, but as a learner I could find that distracting if what I actually wanted to do was select some text which happens to be positioned by the icon.

Sorry for adding the confusion!

If you are an editor i can see that as being interesting, but as a learner I could find that distracting if what I actually wanted to do was select some text which happens to be positioned by the icon.

Clicking on it and landing on the file page is equally confusing. If you use the icon as part of page design (as opposed to, e.g., the user browsing a category of icons), icons should always be used with link=, which prevents the lightbox.

Change 475338 had a related patch set uploaded (by Flutterish; owner: Flutterish):
[mediawiki/extensions/MultimediaViewer@master] SVG files display at max resolution

https://gerrit.wikimedia.org/r/475338

Tgr assigned this task to Flutterish.
Tgr added a subscriber: Flutterish.

Thanks @Flutterish!

Change 475338 merged by jenkins-bot:
[mediawiki/extensions/MultimediaViewer@master] SVG files display at max resolution

https://gerrit.wikimedia.org/r/475338

Tgr added a subscriber: Johan.

@Johan I forgot about the notice and the patch went out this week but probably better late than never? The description will be something like "MediaViewer will now enlarge small SVG images" (and ignore their nominal maximum size but that's probably too technical).