图像裁剪失去了质量MVC3 .Net C＃应用程序

I'm having trouble cropping an image in an MVC3 C# application. I am cropping the image but its losing quality when rendered back in a view. The image to be cropped is loaded from a database and is created from a ByteArray like so...

我在MVC3 C＃应用程序中裁剪图像时遇到问题。我正在裁剪图像，但在视图中渲染时它的质量会下降。要裁剪的图像是从数据库加载的，并且是从ByteArray创建的，如此...

public static Image ByteArrayToImage(byte[] byteArrayIn)
{
   MemoryStream ms = new MemoryStream(byteArrayIn);
   Image returnImage = Image.FromStream(ms);
   return returnImage;
}

When this image is rendered on a view it looks fine and is off the expected quality. I am then selecting a region to crop and using the below method to do the crop...

当此图像在视图上呈现时，它看起来很好并且不符合预期的质量。然后我选择要裁剪的区域并使用以下方法进行裁剪...

public Image CropImage(System.Drawing.Image Image, int Height, int Width, int StartAtX, int StartAtY)
        {
            Image outimage;
            MemoryStream mm = null;
            try
            {
                //check the image height against our desired image height
                if (Image.Height < Height)
                {
                    Height = Image.Height;
                }

                if (Image.Width < Width)
                {
                    Width = Image.Width;
                }

                //create a bitmap window for cropping
                Bitmap bmPhoto = new Bitmap(Width, Height, PixelFormat.Format24bppRgb);
                bmPhoto.SetResolution(Image.VerticalResolution,Image.HorizontalResolution);

                //create a new graphics object from our image and set properties
                Graphics grPhoto = Graphics.FromImage(bmPhoto);
                grPhoto.SmoothingMode = SmoothingMode.AntiAlias;
                grPhoto.InterpolationMode = InterpolationMode.HighQualityBicubic;
                grPhoto.PixelOffsetMode = PixelOffsetMode.HighQuality;

                //now do the crop
                grPhoto.DrawImage(Image, new Rectangle(0, 0, Width, Height), StartAtX, StartAtY, Width, Height, GraphicsUnit.Pixel);

                // Save out to memory and get an image from it to send back out the method.
                mm = new MemoryStream();
                bmPhoto.Save(mm, System.Drawing.Imaging.ImageFormat.Jpeg);
                Image.Dispose();
                bmPhoto.Dispose();
                grPhoto.Dispose();
                outimage = Image.FromStream(mm);

                return outimage;
            }
            catch (Exception ex)
            {
                throw new Exception("Error cropping image, the error was: " + ex.Message);
            }
        }

This cropped image is then converted back to a ByteArray and can be saved into a database like so...

然后将此裁剪后的图像转换回ByteArray，并将其保存到数据库中，如此...

public static byte[] ImageToByteArray(System.Drawing.Image imageIn)
{
    MemoryStream ms = new MemoryStream();
    imageIn.Save(ms, System.Drawing.Imaging.ImageFormat.Gif);
    return ms.ToArray();
}

When this image is later rendered on the view its quality is a lot worse than the original image. It looks quite pixilated. The original image in this case is .jpg but could be any format.

当此图像稍后在视图上呈现时，其质量比原始图像差很多。它看起来非常像素化。在这种情况下，原始图像是.jpg，但可以是任何格式。

This is an image of the image after it has been loaded from the database and being cropped...

这是从数据库加载并被裁剪后的图像...

This image is the result of the crop. As you can see its not good.

此图像是作物的结果。你可以看到它不好。

I have seen some other posts on the topic but they haven’t helped. Can anyone suggest a solution?

我已经看过关于这个主题的其他一些帖子，但他们没有帮助。有谁能提出解决方案？

Thank you

谢谢

2 个解决方案

#1

This is a great blog that sums it all up. I have it working in my application now. http://blog.tallan.com/2011/02/04/using-mvc3-razor-helpers-and-jcrop-to-upload-and-crop-images/

这是一个很好的博客，总结了一切。我现在在我的应用程序中工作。 http://blog.tallan.com/2011/02/04/using-mvc3-razor-helpers-and-jcrop-to-upload-and-crop-images/

#2

Gunnar Peipman has a blog post about the quality called Resizing images without loss of quality. Gunnar says some trick about what is going wrong;

Gunnar Peipman有一篇关于质量的博客文章称为Resizing images而不会降低质量。 Gunnar说出了一些关于出错的伎俩;

If the Image contains an embedded thumbnail image, this method retrieves the embedded thumbnail and scales it to the requested size. If the Image does not contain an embedded thumbnail image, this method creates a thumbnail image by scaling the main image.

如果图像包含嵌入的缩略图图像，则此方法将检索嵌入的缩略图并将其缩放到请求的大小。如果图像不包含嵌入的缩略图图像，则此方法通过缩放主图像来创建缩略图图像。

The GetThumbnailImage method works well when the requested thumbnail image has a size of about 120 x 120 pixels. If you request a large thumbnail image (for example, 300 x 300) from an Image 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 the DrawImage method.

当请求的缩略图图像的大小约为120 x 120像素时，GetThumbnailImage方法很有效。如果从具有嵌入式缩略图的图像请求大型缩略图图像（例如，300 x 300），则缩略图图像中可能会出现明显的质量损失。通过调用DrawImage方法缩放主图像（而不是缩放嵌入的缩略图）可能更好。

And razor syntax is amicable with JCrop and there is a cool blog post about how you can use it.

并且razor语法与JCrop很友好，并且有一篇关于如何使用它的很酷的博客文章。