如何根据一组随机图像裁剪图像？答案

【问题标题】：How can an image be cropped based on a set scale of random image?如何根据一组随机图像裁剪图像？
【发布时间】：2012-11-02 01:03:22
【问题描述】：

致力于允许上传各种尺寸的图像，然后允许裁剪图像的预定义区域以作为缩略图。

缩略图大小预定义为 150x150。使用Jcrop.js 工具选择图像的一部分。

问题：

当通过在渲染的图像上设置高度/宽度以比原始图像更小的尺寸显示上传的图像时，在选择要裁剪的区域时会出现比例因子。

您要么必须按比例缩小裁剪区域，要么必须根据实际图像的大小与显示的大小进行比较来缩放图像。

问题：

如何计算浏览器显示图像与原始图像的比例？我目前正在使用以下代码来保存图像，但我将如何考虑缩放？

public static Image CropImage(Image originalImage, int x, int y, int width, int height)
    {
        var bmp = new Bitmap(width, height);
        bmp.SetResolution(originalImage.HorizontalResolution, originalImage.VerticalResolution);

        using (var graphic = Graphics.FromImage(bmp))
        {
            graphic.SmoothingMode = SmoothingMode.AntiAlias;
            graphic.InterpolationMode = InterpolationMode.HighQualityBicubic;
            graphic.PixelOffsetMode = PixelOffsetMode.HighSpeed;

            graphic.DrawImage(originalImage, new Rectangle(0, 0, width, height), x, y, width, height, GraphicsUnit.Pixel);

            return bmp;
        }
    }

额外问题：

我发现的另一个问题是，在创建一个创建ImageFormatMemoryBMP 的新位图以及尝试调用 Bitmap.Save(memorystream, original rawformat) 时，似乎没有有效的方法来传输原始文件的 ImageFormat会爆炸。而且位图 RawFormat 没有设置器。

那么如何设置新位图的格式呢？

【问题讨论】：

标签： asp.net crop system.drawing jcrop

【解决方案1】：

我想也许这个问题纯粹是在前端解决的，不需要为此使用任何服务器端。

Jcrop 有一个内置的比例因子处理程序。

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

据我了解，现在您可以通过两种方式使用它。要么使用'box sizing'在前端为你'resize'图像，或者你可以告诉它图像的'truesize'，它会计算出比例因子并自己处理坐标。

盒子尺寸

$('#cropbox').Jcrop({ boxWidth: 450, boxHeight: 400 });

真实尺寸

$.Jcrop('#cropbox',{ trueSize: [500,370] });

使用真实尺寸方法，您需要使用 api 方法调用 jcrop： http://deepliquid.com/content/Jcrop_API.html#API_Invocation_Method

var jcrop_api,
options = { trueSize: [500,370] };

$('#target').Jcrop(options,function(){
jcrop_api = this;
});

祝你好运！

【讨论】：