Image Resize: Loss of Qualtiy | Tech Off

PeterH
Iomesus

Over the past few days I've been making a fairly lightweight image resizer just to get back into C# again. It retains aspect ratio based on a width or a height value that can be defined in percent or pixels.

It all seems to be working fine except for one problem:

I am using the

Bitmap.Save(Bitmap originalImage, Size size);

method and whenever I scale to below around the 50% mark the image is distroted and any text is impossible to read.

Is this due to the Bitmap.Save() function? I have decided that there cannot be an error in my 'Size' calculation because the final image is in the right ratio.

Here is an example of the problem:

Original

50%

25% (distorted)

Thanks,

- PeterH

SimonJ

Your 25% version is only 80x60 pixels so are you really surprised that you can no longer read italic text which was slanted diagonally away from the camera?

If you compare your 25% to the original image rezied to 25% in an application such as Paint Shop Pro you'll see that their result is much smoother. PSP doesn't just throw away unwanted pixels, to reduce to 25% it averages four pixels to produce one.

SimonJ

jdewalt

What your resize does is this

Blue Blue Blue Blue Blue Yellow Yellow Yellow
Blue Blue Blue Blue Yellow Yellow Yellow Yellow
Blue Blue Blue Yellow Yellow Yellow Yellow Yellow
Blue Blue Yellow Yellow Yellow Yellow Yellow Yellow

becomes

Blue Blue Blue Yellow
Blue Blue Yellow Yellow
Blue Blue Yellow Yellow
Blue Yellow Yellow Yellow

then

Blue Blue
Blue Yellow
Blue Yellow
Blue Yellow

A more advanced programs blend pixels horizontally as well like so

Blue Blue Blue Blue Blue Yellow Yellow Yellow
Blue Blue Blue Blue Yellow Yellow Yellow Yellow
Blue Blue Blue Yellow Yellow Yellow Yellow Yellow
Blue Blue Yellow Yellow Yellow Yellow Yellow Yellow

becomes

Blue Blue Green Yellow
Blue Blue Yellow Yellow
Blue Green Yellow Yellow
Blue Yellow Yellow Yellow

becomes

Blue Green-Yellow
Blue Yellow
Blue-Green Yellow
Green Yellow

When viewed large scale this will look better to the human eye.

Even more advanced programs will blend even more(breaking each pixel into 16 pixels and then shrinking hte image into those, and then averaging the color value for each pixel from its 16 subpixels.)
so one pixel value becomes {4,4} pixel values when scaling to 25%.

However any scaling obviously looses infromation. This is why 3d video games use mip mapping (they actually start with small, medium, large images of the same thing and scale only to a certain percent then switch to a different picture) and vector based graphics which are rendered dynamically so they can scale correctly.

W3bbo
The Master of Baiters

jdewalt wrote:

This is why 3d video games use mip mapping (they actually start with small, medium, large images of the same thing and scale only to a certain percent then switch to a different picture) and vector based graphics which are rendered dynamically so they can scale correctly.

Uh... mip-mapping is something else.

Mip-mapping is when game engines use smaller-resolution textures for models when they are viewed at a distance, so the video-card doesn't need to render an "up-close" 2048x1536 texture when your character is 2 miles away from it.

They're there for performance reasons, not visual quality.

Of course, most cards let you override mip-mapping settings (that's what the Performance/Quality slider in nVidia's panel does)

PeterH
Iomesus

Thanks to both of you. So how can I impliment a smoothing function into my program. I'm not sure if this is even close to correct, but would a bilinear filter solve the problem?

PeterH
Iomesus

Fixed with bicubic interpolation.

Result:

Before bicubic interpolation:

After bicubic interpolation:

jdewalt

Thanks W3bbo.

I had always thought of mip mapping as a way to use a diffent texture when you got up close so it looked better, didn't realize it was done for performance rather than visual quality.

I've been doing it backwords Smiley

. Oh well i like my way better.

I traditionally used low res (small images) when i was far away from something like grass, as i zoomed in i would use higher res (large images), until i eventually would render it programmatically.

The only times i've used this technique in the past was for trees, snowflakes, and grass.

(i.e. snowflake starts as small white dot image, zooms to have more detail, and eventually is drawn programatically when close enough so it can have infinite detail.)

Is this what you were refering to or do i have it backwords?

Tom Servo
W-hat?

IIRC there's a way to perform antialiasing using System.Drawing, I've to dig up some old sourcecode to find an example.

--edit: I guess I lost it because I didn't back up Inetpub ;/

W3bbo
The Master of Baiters

Tom Servo wrote:

IIRC there's a way to perform antialiasing using System.Drawing, I've to dig up some old sourcecode to find an example.

--edit: I guess I lost it because I didn't back up Inetpub ;/

That wasn't anti-aliasing. You're after a better interpoliation algorithm.

Minh
WOOH! WOOH!

PeterH wrote:

Fixed with bicubic interpolation.

Result:

Before bicubic interpolation:

After bicubic interpolation:

Hopefully, you did this with .net's built-in bilinear filtering function & not write your own. Smiley

Minh
WOOH! WOOH!

W3bbo wrote:

Of course, most cards let you override mip-mapping settings (that's what the Performance/Quality slider in nVidia's panel does)

My ATI Performance/Quality slider controls heckuvlot more than just mipmap detail levels. Smiley

There's fullscreen anti-aliasing, anistropic filtering, etc...

W3bbo
The Master of Baiters

Minh wrote:

W3bbo wrote: Of course, most cards let you override mip-mapping settings (that's what the Performance/Quality slider in nVidia's panel does)

My ATI Performance/Quality slider controls heckuvlot more than just mipmap detail levels. There's fullscreen anti-aliasing, anistropic filtering, etc...

I meant the single "Peformance / Quality" slider, not the individual sliders for all of 'em =P

*checks own CP*

Hmm, nVidia's changed it. Now its under the guise of "Image Settings"

PeterH
Iomesus

Minh wrote:

Hopefully, you did this with .net's built-in bilinear filtering function & not write your own.

Yeah, I found out about it just in time, I was about to write my own. Tongue Out

Minh
WOOH! WOOH!

W3bbo wrote:

I meant the single "Peformance / Quality" slider, not the individual sliders for all of 'em =P

*checks own CP*

Hmm, nVidia's changed it. Now its under the guise of "Image Settings"

I got to thinking about what does Quality/Performance mean in term of mipmaps. Mipmaps are usually generated prior to entering the "game loop", so performance doesn't mean make my game run fast & let the quality of each mipmap suffer in return. Since you're really creating a smaller version of each texture, you can use bilinear or trilinear & have no loss of quality.

I'm guessing that quality/performance in this sense means that the system will control the number of mipmaps created for each texture. So, fewer levels means the game will take up less video memory & therefore, somehow runs faster?