Problem with reading JPEG images in .NET

  • Thread starter Thread starter Nick Gilbert
  • Start date Start date
N

Nick Gilbert

Hi,
I've noticed a problem reading in JPEG images using "new Bitmap()" in .NET

I'm not sure if I'm doing something wrong or if there's a bug in .NET's
image code.

I have noticed that when reading some images into .NET, sometimes they
load in an extremely low quality (like they've been resized up from a
thumbnail or icon size). It seems .NET is finding an internal thumbnail
inside the JPEG file and it's using that instead of the main image.

For example please try the following two images which are identical
resolution (295 x 219), but one of them has has been re-encoded in
Photoshop.

http://www.nickgilbert.com/random/samplea.jpg (low quality)
http://www.nickgilbert.com/random/sampleb.jpg (OK)

Sample A loads in looking extremely blurred, despite the fact that looks
identical to the other one when viewed in any browser or Adobe Photoshop.

This problem means that the processed images I'm exporting from my
application are sometimes (and randomly) extremely low quality, and I
have no way of detecting that this problem has occurred.

Am I doing something wrong or does .NET not understand that some JPEGs
have internal thumbnail images?

Thanks,

Nick
 
Hello Nick,
I have noticed that when reading some images into .NET, sometimes they
load in an extremely low quality (like they've been resized up from a
thumbnail or icon size). ... [snip]
Sample A loads in looking extremely blurred, despite the fact that looks
identical to the other one when viewed in any browser or Adobe Photoshop.

I wrote a very simple WinForms application with a button and two
PictureBoxes on a form. For the code, I wrote:

---------------------------
private void button1_Click(object sender, EventArgs e)
{
Bitmap a = new Bitmap("C:\\samplea.jpg");
Bitmap b = new Bitmap("C:\\sampleb.jpg");
pictureBox1.Image = a;
pictureBox2.Image = b;
}
---------------------------

With this test at least, the both of images look fine to me. You are using
the Bitmap class in an ASP.NET application, how are you loading the images?
Are you doing any processing?

Adobe Photoshop likely adds an ICC profile and possibly a thumbnail to the
JPEGs. Also, have you checked that the color profile is sRGB and note Adobe
RGB? Try "Export To Web" from Photoshop to see if that makes any difference.

--
Regards,

Jani Järvinen
C# MVP
Vantaa, Finland
E-mail: (e-mail address removed)
Business: http://www.nimacon.net/
Personal: http://www.saunalahti.fi/janij/
 
you sure you are not running off some cache somewhere in your page.

The two images look exactly the same when i clicked on your links

Miro
 
Hi,
I've noticed a problem reading in JPEG images using "new Bitmap()" in .NET

I'm not sure if I'm doing something wrong or if there's a bug in .NET's
image code.

I have noticed that when reading some images into .NET, sometimes they
load in an extremely low quality (like they've been resized up from a
thumbnail or icon size). It seems .NET is finding an internal thumbnail
inside the JPEG file and it's using that instead of the main image.

For example please try the following two images which are identical
resolution (295 x 219), but one of them has has been re-encoded in
Photoshop.

http://www.nickgilbert.com/random/samplea.jpg(low quality)http://www.nickgilbert.com/random/sampleb.jpg(OK)

Sample A loads in looking extremely blurred, despite the fact that looks
identical to the other one when viewed in any browser or Adobe Photoshop.

This problem means that the processed images I'm exporting from my
application are sometimes (and randomly) extremely low quality, and I
have no way of detecting that this problem has occurred.

Am I doing something wrong or does .NET not understand that some JPEGs
have internal thumbnail images?

Thanks,

Nick

Try this

WebForm1.aspx

<div>
<img src="WebForm2.aspx?url=http://www.nickgilbert.com/random/
samplea.jpg&<%=DateTime.Now.Ticks%>" />
<img src="WebForm2.aspx?url=http://www.nickgilbert.com/random/
sampleb.jpg&<%=DateTime.Now.Ticks%>" />
</div>

WebForm2.aspx

protected void Page_Load(object sender, EventArgs e)
{
string qs = Request.QueryString["url"];
Bitmap objSourceBitmap = null;

LoadImageFromURL(qs, ref objSourceBitmap);

Bitmap objTargetBitmap = new Bitmap(148, 110);
Graphics objGraphics = Graphics.FromImage(objTargetBitmap);

objGraphics.CompositingQuality = CompositingQuality.Default;
objGraphics.InterpolationMode = InterpolationMode.Bilinear;
Rectangle recCompression = new Rectangle(0, 0, 148, 110);
objGraphics.DrawImage(objSourceBitmap, recCompression);

objTargetBitmap.Save(Response.OutputStream,
System.Drawing.Imaging.ImageFormat.Jpeg);

objGraphics.Dispose();
objTargetBitmap.Dispose();

Response.End();
}

private void LoadImageFromURL(string URL, ref Bitmap Img)
{
const int BYTESTOREAD = 10000;
WebRequest myRequest = WebRequest.Create(URL);
WebResponse myResponse = myRequest.GetResponse();
Stream ReceiveStream = myResponse.GetResponseStream();
BinaryReader br = new BinaryReader(ReceiveStream);
MemoryStream memstream = new MemoryStream();
byte[] bytebuffer = new byte[BYTESTOREAD];
int BytesRead = br.Read(bytebuffer, 0, BYTESTOREAD);
while (BytesRead > 0)
{
memstream.Write(bytebuffer, 0, BytesRead);
BytesRead = br.Read(bytebuffer, 0, BYTESTOREAD);
}
Img = new Bitmap(memstream);
}
 
Jani said:
Hello Nick,
I have noticed that when reading some images into .NET, sometimes they
load in an extremely low quality (like they've been resized up from a
thumbnail or icon size). ... [snip]
Sample A loads in looking extremely blurred, despite the fact that looks
identical to the other one when viewed in any browser or Adobe Photoshop.

I wrote a very simple WinForms application with a button and two
PictureBoxes on a form. For the code, I wrote:

---------------------------
private void button1_Click(object sender, EventArgs e)
{
Bitmap a = new Bitmap("C:\\samplea.jpg");
Bitmap b = new Bitmap("C:\\sampleb.jpg");
pictureBox1.Image = a;
pictureBox2.Image = b;
}
---------------------------

With this test at least, the both of images look fine to me. You are using
the Bitmap class in an ASP.NET application, how are you loading the images?
Are you doing any processing?

Adobe Photoshop likely adds an ICC profile and possibly a thumbnail to the
JPEGs. Also, have you checked that the color profile is sRGB and note Adobe
RGB? Try "Export To Web" from Photoshop to see if that makes any difference.


I have found the cause of the problem. I'm using GetThumbnailImage()

Apparently this sometimes finds a low quality embedded thumbnail inside
the JPEG, and will always use that instead of the real image. This means
this function is useless for resizing images to anything other than a
very small thumbnail smaller than 100x100. I will replace the code with
some code which doesn't call this method.

Thanks,
Nick...
 
Jani said:
Hello Nick,
I have noticed that when reading some images into .NET, sometimes they
load in an extremely low quality (like they've been resized up from a
thumbnail or icon size). ... [snip]
Sample A loads in looking extremely blurred, despite the fact that looks
identical to the other one when viewed in any browser or Adobe Photoshop.

I wrote a very simple WinForms application with a button and two
PictureBoxes on a form. For the code, I wrote:

---------------------------
private void button1_Click(object sender, EventArgs e)
{
Bitmap a = new Bitmap("C:\\samplea.jpg");
Bitmap b = new Bitmap("C:\\sampleb.jpg");
pictureBox1.Image = a;
pictureBox2.Image = b;
}
---------------------------

With this test at least, the both of images look fine to me. You are using
the Bitmap class in an ASP.NET application, how are you loading the images?
Are you doing any processing?

Adobe Photoshop likely adds an ICC profile and possibly a thumbnail to the
JPEGs. Also, have you checked that the color profile is sRGB and note Adobe
RGB? Try "Export To Web" from Photoshop to see if that makes any difference.


I have found the cause of the problem. I'm using GetThumbnailImage()

Apparently this sometimes finds a low quality embedded thumbnail inside
the JPEG, and will always use that instead of the real image. This means
this function is useless for resizing images to anything other than a
very small thumbnail smaller than 100x100. I will replace the code with
some code which doesn't call this method.

Thanks,
Nick...
 
Jani said:
Hello Nick,
I have noticed that when reading some images into .NET, sometimes they
load in an extremely low quality (like they've been resized up from a
thumbnail or icon size). ... [snip]
Sample A loads in looking extremely blurred, despite the fact that looks
identical to the other one when viewed in any browser or Adobe Photoshop.
I wrote a very simple WinForms application with a button and two
PictureBoxes on a form. For the code, I wrote:
---------------------------
private void button1_Click(object sender, EventArgs e)
{
    Bitmap a = new Bitmap("C:\\samplea.jpg");
    Bitmap b = new Bitmap("C:\\sampleb.jpg");
    pictureBox1.Image = a;
    pictureBox2.Image = b;
}
---------------------------
With this test at least, the both of images look fine to me. You are using
the Bitmap class in an ASP.NET application, how are you loading the images?
Are you doing any processing?
Adobe Photoshop likely adds an ICC profile and possibly a thumbnail to the
JPEGs. Also, have you checked that the color profile is sRGB and note Adobe
RGB? Try "Export To Web" from Photoshop to see if that makes any difference.

I have found the cause of the problem. I'm using GetThumbnailImage()

Apparently this sometimes finds a low quality embedded thumbnail inside
the JPEG, and will always use that instead of the real image. This means
this function is useless for resizing images to anything other than a
very small thumbnail smaller than 100x100.  I will replace the code with
some code which doesn't call this method.

Thanks,
Nick...- Hide quoted text -

- Show quoted text -

Yup. MSDN says: GetThumbnailImage works well when the requested
thumbnail image has a size of about 120 x 120. If you request a large
thumbnail image (say 300 x 300) from an Image object that has an
embedded thumbnail, there could be a noticeable loss of quality in the
thumbnail image. It might be better to scale the main image (instead
of scaling the embedded thumbnail) by calling DrawImage.

http://msdn.microsoft.com/en-us/library/system.drawing.image.getthumbnailimage(VS.71).aspx

Good luck
 
Alexey said:
Jani said:
Hello Nick,
I have noticed that when reading some images into .NET, sometimes they
load in an extremely low quality (like they've been resized up from a
thumbnail or icon size). ... [snip]
Sample A loads in looking extremely blurred, despite the fact that looks
identical to the other one when viewed in any browser or Adobe Photoshop.
I wrote a very simple WinForms application with a button and two
PictureBoxes on a form. For the code, I wrote:
---------------------------
private void button1_Click(object sender, EventArgs e)
{
Bitmap a = new Bitmap("C:\\samplea.jpg");
Bitmap b = new Bitmap("C:\\sampleb.jpg");
pictureBox1.Image = a;
pictureBox2.Image = b;
}
---------------------------
With this test at least, the both of images look fine to me. You are using
the Bitmap class in an ASP.NET application, how are you loading the images?
Are you doing any processing?
Adobe Photoshop likely adds an ICC profile and possibly a thumbnail to the
JPEGs. Also, have you checked that the color profile is sRGB and note Adobe
RGB? Try "Export To Web" from Photoshop to see if that makes any difference.
I have found the cause of the problem. I'm using GetThumbnailImage()

Apparently this sometimes finds a low quality embedded thumbnail inside
the JPEG, and will always use that instead of the real image. This means
this function is useless for resizing images to anything other than a
very small thumbnail smaller than 100x100. I will replace the code with
some code which doesn't call this method.

Thanks,
Nick...- Hide quoted text -

- Show quoted text -

Yup. MSDN says: GetThumbnailImage works well when the requested
thumbnail image has a size of about 120 x 120. If you request a large
thumbnail image (say 300 x 300) from an Image object that has an
embedded thumbnail, there could be a noticeable loss of quality in the
thumbnail image. It might be better to scale the main image (instead
of scaling the embedded thumbnail) by calling DrawImage.

http://msdn.microsoft.com/en-us/library/system.drawing.image.getthumbnailimage(VS.71).aspx

OK, I tried DrawImage but it then produced a high quality thumbnail
which had a black or grey border on the edges. Many online samples crop
out the border, but to me, this is a hack. Eventually I found a method
to produce high quality resized images of any size, which do not have
any kind of border visible. Code below for completeness:

Bitmap bitmap =
new Bitmap((int)new_width, (int)new_height, m_src_image.PixelFormat);
Graphics g = Graphics.FromImage(bitmap);
g.CompositingMode = CompositingMode.SourceCopy;
g.PixelOffsetMode = PixelOffsetMode.HighQuality;
g.SmoothingMode = SmoothingMode.HighQuality;
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
// NMG: the following 2 lines ensures GDI+ has enough pixels to work
// with when interpolating near edges
ImageAttributes ia = new ImageAttributes();
ia.SetWrapMode(WrapMode.TileFlipXY);
g.DrawImage(m_src_image,
new Rectangle(0, 0, bitmap.Width, bitmap.Height),
0, 0, m_src_image.Width, m_src_image.Height,
GraphicsUnit.Pixel, ia);

The important it here is the ImageAttributes. Some people reported good
results with the CompositingMode and PixelOffsetMode lines, but I found
that although these reduced the border, the border was still visible in
images with a very light, or white background.

Fundamentally, the code above does not use any embedded thumbnail image,
so it can be used to resize an image to any size in good quality.

Nick.
 
Back
Top