search

fisharebest / webtrees

Online genealogy
https://webtrees.net
GNU General Public License v3.0
462 stars 299 forks source link

Display SVG images #4500

Open papjul opened 2 years ago

papjul commented 2 years ago

Hi, my armorials are in SVG format but they don't display in Webtrees (they display only if you download them).

Side note: SVG format doesn't need any thumbnail as the acronym says, images can be scaled in size (by the browser) without loss of quality.

fisharebest commented 2 years ago

Our image library (intervention) does not support SVG. In theory, it can convert SVG to bitmap formats, but in practice, the images are garbled.

We pass the image dimensions to the server as URL parameters<img src="image?height=150&width=100"> and assume the result will be that size. To resize in the page using CSS, we'd need to read the image and determine the aspect ratio, etc., to generate <img src="..." width="100" height="150">. We deliberately don't read image files when generating the page for performance reasons.

We also crop images on the server. With SVG, we'd need to do this in CSS/HTML.

So it's not a trivial change, as we would need to re-design most of the image/thumbnail handling code.

papjul commented 2 years ago

Why does this library need to manipulate SVG? Can't we just check the mime-type and pass the SVG directly with no manipulation if it is a SVG?

As for the aspect ratio, you should use object-fit property: https://developer.mozilla.org/fr/docs/Web/CSS/object-fit https://caniuse.com/object-fit (you can use a polyfill for IE if you really need to support it)

fisharebest commented 2 years ago

Why does this library need to manipulate SVG? Can't we just check the mime-type and pass the SVG directly with no manipulation if it is a SVG?

I didn't say it needs to. I am just documenting the current structure (which does all crop/resize/conversion operations on the server).