Crop Image Issue when not showing Actual Image using C#

Question

I am using JCrop to Crop Image. It is working fine if I show Actual Image to user. But, If I show Resize Image rather than Actual Image then I am getting Co-ordinates of Resize Image.

Then, How do I Crop Image based on it ? Here, I am passing Image path of Saved Image.

In short, If Saved Image size if for i.e. 715 * 350 then I am showing it in popup in Small Size based on CSS. So, I will get Co-ordinates of that Small Size Image. and I am applying those Co-ordinates on Main Image.

My Code:

using (System.Drawing.Image OriginalImage = System.Drawing.Image.FromFile(Img))
            {
                using (System.Drawing.Bitmap bmp = new System.Drawing.Bitmap(Width, Height))
                {
                    bmp.SetResolution(OriginalImage.HorizontalResolution, OriginalImage.VerticalResolution);

                    using (System.Drawing.Graphics Graphic = System.Drawing.Graphics.FromImage(bmp))
                    {
                        Graphic.SmoothingMode = SmoothingMode.AntiAlias;
                        Graphic.InterpolationMode = InterpolationMode.HighQualityBicubic;
                        Graphic.PixelOffsetMode = PixelOffsetMode.HighQuality;
                        Graphic.DrawImage(OriginalImage, new System.Drawing.Rectangle(0, 0, Width, Height), X, Y, Width, Height, System.Drawing.GraphicsUnit.Pixel);

                        MemoryStream ms = new MemoryStream();
                        bmp.Save(ms, OriginalImage.RawFormat);

                        ms.Close();
                        ms.Flush();
                        ms.Dispose();

                        return ms.GetBuffer();
                    }
                }
            }

Answer 1

The code you show is made for resizing, not for cropping (In the Graphic.DrawImage() call, you don't care about the cropping coordinates, and just apply a destination Width/Height)

For cropping an image, you can just use the Bitmap.Clone() method. Just pass to it the cropping coordinates you extracted from JCrop. (cropzone in the following example)

public static async Task CropImage()
{
    var client = new WebClient();
    var sourceimg = new Uri(@"http://logonoid.com/images/stack-overflow-logo.png");
    var destination = new FileInfo(Path.Combine(Directory.GetCurrentDirectory(), "logoCropped.png"));
    if (destination.Exists)
        destination.Delete();
    using (Stream sourceStream = await client.OpenReadTaskAsync(sourceimg))
    {
        using (Bitmap source = new Bitmap(sourceStream))
        {
            Rectangle cropzone = new Rectangle(0, 0, 256, 256);
            using (Bitmap croppedBitmap = source.Clone(cropzone, source.PixelFormat))
            {
                croppedBitmap.Save(destination.FullName, ImageFormat.Png);
            }
        }
    }
}

Some advices about your code :

• When just cropping, there's no resizing operation involved. So the SmoothingMode, InterpolationMode, PixelOffsetMode parameters are useless here.
• About the MemoryStream, you should better use it in a using statement. It avoids manual calls to Close() and Dispose(), and guaranty they're called whatever happens. And about the Flush() method, it just does nothing on the MemoryStream class.

Answer 2

Jcrop has tureSize property.

$.Jcrop('#image',{ trueSize: [715, 350] });

you should get the correct coordinates of the large image.

http://deepliquid.com/content/Jcrop_Sizing_Issues.html