imageproxy icon indicating copy to clipboard operation
imageproxy copied to clipboard

Scale to width and height without cropping

Open andersaa opened this issue 4 years ago • 3 comments

Hi It would be very useful to be able to scale an image to both a max width and max height without cropping. Basically make it fit inside a box that is e.g. 200x300, but without cropping it.

As far as I can tell this is not possible, or am I missing something? It would be awesome to have in place.

Thanks!

Anders

andersaa avatar May 29 '20 11:05 andersaa

Is the original image a 2:3 ratio? If so, then that shouldn't be a problem. If it's not, then you're right that it's not possible. imageproxy never distorts or skew images. If this is for the web, then you can of course do all of that with CSS (or even height and width attributes on an <img> tag)

willnorris avatar May 29 '20 15:05 willnorris

The original images are of arbitrary size and aspect ratio. I am displaying them in a table, so I would like to specify a max width and height so that they don't occupy too much space.

Good point about CSS, I will try to achieve this by specifying a max width with imageproxy and do the height scaling with CSS. Would still love to see support for both max width and height though!

Thanks again for making this.

-Anders

andersaa avatar Jun 03 '20 09:06 andersaa

Would be interested in this as well. Relates to (or duplicate of) #220. Another term (for people searching) typically used for this is "padded" or "padding".

Another way to define it is: If the pad algorithm is selected, it will always generate an image for the provided width/height and ensure that the image is contained within those bounds (thus requiring extra padding on the top/bottom or left/right sides, depending on aspect ratio of the source -> destination dimensions). The source and destination dimensions are completely arbitrary.

So, a simple example would be (in this case generated by a PHP library using ImageMagick behind the scenes):

Source: 400 x 300

animated-example1

Destination: 100 x 100 (with #ff77ff pad color)

animated-example1

patricknelson avatar Jul 02 '20 21:07 patricknelson