Scaling image to 1600px X 700 px

Question

When an user uploads any image, can we scale it to 1600 X 700?

I'm using the code below to scale the images which are 1996 X 1442 , but it never scales to 1600 X 700.

Any better way or other way to achieve it?

private static Image resizeImage(Image imgToResize, Size size)
        {
            int sourceWidth = imgToResize.Width;
            int sourceHeight = imgToResize.Height;

            float nPercent = 0;
            float nPercentW = 0;
            float nPercentH = 0;

            nPercentW = ((float)size.Width / (float)sourceWidth);
            nPercentH = ((float)size.Height / (float)sourceHeight);

            if (nPercentH < nPercentW)
                nPercent = nPercentH;
            else
                nPercent = nPercentW;

            int destWidth = (int)(sourceWidth * nPercent);
            int destHeight = (int)(sourceHeight * nPercent);

            Bitmap b = new Bitmap(destWidth, destHeight);
            Graphics g = Graphics.FromImage((Image)b);
            g.InterpolationMode = InterpolationMode.HighQualityBicubic;

            g.DrawImage(imgToResize, 0, 0, destWidth, destHeight);
            g.Dispose();

            return (Image)b;
        }

If you check the comments below, they say it's not possible to archive it without loosing aspect ratio, but if I see the HERO images from airbnb they have images which are of 1600 X 700...

So I think it's somehow possible but I don't know how to achieve it...

what error do you get or what is the result of your operation? — webber2k6, Dec 21 '12 at 08:50
Check this.. http://stackoverflow.com/questions/249587/high-quality-image-scaling-c-sharp. — Mullaly, Dec 21 '12 at 08:53
Size size = new Size(10000,700); var test = resizeImage(Demo, size); gave me a image of 989* 699 — Manish, Dec 21 '12 at 08:55
Rounding issues are part of the problem - basically you're cutting off the decimal places when calculating `destWidth` and `destHeight`. If you use `Math.Round` and always round "up", you'll probably end up with what you expect. — Thorsten Dittmar, Dec 21 '12 at 08:58
if i use http://stackoverflow.com/questions/249587/high-quality-image-scaling-c-sharp , then i might get distorted image..:( — Manish, Dec 21 '12 at 09:04

Thorsten Dittmar · Answer 1 · 2012-12-21T09:00:24.957

2

Of course not, as 1600 x 700 has a different aspect ratio (0.4375) than 1996 x 1442 (0.7724). The way you do it is to scale keeping the aspect ratio, so you'll never get to 1600 x 700 from 1996 x 1442.

You could:

Scale the image so that the longer corner is 1600 long and then cut out a relevant part of size 1600 x 700 (keeping the aspect ratio).
Scale the image to 1600 x 700, probably distorting the image as it is vertically "squeezed".

Another problem in your code are rounding issues.

int destWidth = (int)...;
int destHeight = (int)...;

simply cuts off the decimal places. Even if the computation result would be 699.9, destWidth would be 699.

You might want to use Math.Round instead, which would round 699.9 to 700 as expected.

edited Dec 21 '12 at 09:00

answered Dec 21 '12 at 08:51

Thorsten Dittmar

55,956
8
91
139

I checked airbnb websites..to my surprise they have images which have resolution of 1600 * 700..any idea how they do it.... https://a2.muscache.com/airbnb/static/landing_pages/home_v2/hero/444289-9b65d1bff060f336ac132aa628f55370.jpg – Manish Dec 21 '12 at 09:06
here is what i,m expecting.. 1) I dont want to loose aspect ratio 2) I want image to be of 1600 * 700 .. and from the comments i feel its not possible..but if I see sites like airbnb they are achieving it..their HERO images are of the same size 1600 * 700. – Manish Dec 21 '12 at 09:13
Well, maybe they just cut out the relevant part of the image? – Thorsten Dittmar Dec 21 '12 at 09:22
can you please give me a snippet for it? – Manish Dec 21 '12 at 09:27

score 1 · Answer 2 · answered Dec 21 '12 at 08:59

1

Well, actually yes! There is almost nothing impossible in this world. Just try to search information about "seam carving". Sorry, no code here, because I'm not so familiar with these algorithms.

answered Dec 21 '12 at 08:59

Sergei Danielian

4,938
4
36
58

Rawling · Answer 3 · 2012-12-21T10:20:58.067

I've tweaked your method in a few ways:

It now scales according to the bigger ratio, not the smaller one, so you will end up trimming bits off your image rather than leaving white(?) letterboxing. (This is just < vs > though so it's easy to change.)
For the side that should be equal, this ensures it's equal, rather than scaling and rounding and hoping you don't end up with one pixel difference.
If the aspect ratios do not match, it centers the drawn image on g so you end up with equal amounts trimmed off left and right or top and bottom. (Without knowing that the original image is in the correct ratio, you have to decide somehow which bits of the image to trim off.)

Give it a try and see if you like the results.

private static Image resizeImage(Image imgToResize, Size size)
{
    int sourceWidth = imgToResize.Width;
    int sourceHeight = imgToResize.Height;

    double wRatio = (double)size.Width / sourceWidth;
    double hRatio = (double)size.Height / sourceHeight;

    int destWidth, destHeight;
    float top, left;

    if (wRatio > hRatio) // reverse for white bars rather than trimming
    {
        destWidth = size.Width;
        destHeight = (int)Math.Ceiling(sourceHeight * wRatio);
        left = 0;
        top = (destHeight - size.Height) / 2f;
    }
    else
    {
        destHeight = size.Height;
        destWidth = (int)Math.Ceiling(sourceWidth * hRatio);
        top = 0;
        left = (destWidth - size.Width) / 2f;
    }

    Bitmap b = new Bitmap(size.Width, size.Height);
    Graphics g = Graphics.FromImage((Image)b);
    g.InterpolationMode = InterpolationMode.HighQualityBicubic;

    g.DrawImage(imgToResize, left, top, destWidth, destHeight);
    g.Dispose();

    return (Image)b;
}

its doing well , but not the exact thing...its giving me proper width i.e 1600 but fails to give me proper height 700 . I think you can make it tweak little more...thanks for your help and support. — Manish, Dec 21 '12 at 09:39

score -1 · Answer 4 · answered Dec 21 '12 at 08:55

This code preserves the Aspect Ratio of the original image. If preserving it is not important, then you can get rid of the ratio calculation part and create a Bitmap object with the size provided directly.

private static Image resizeImage(Image imgToResize, Size size)
{
    Bitmap b = new Bitmap(size.Width, size.Height);
    Graphics g = Graphics.FromImage((Image)b);
    g.InterpolationMode = InterpolationMode.HighQualityBicubic;

    g.DrawImage(imgToResize, 0, 0, destWidth, destHeight);
    g.Dispose();

    return (Image)b;
}

@user1921045, that is what I wrote, If preserving the aspect ratio is not important you can use this code. I just wanted to help. — tafa, Dec 21 '12 at 09:44

Scaling image to 1600px X 700 px

4 Answers4