1

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

缩略图大小预定义为 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;
        }
    }

奖金问题：

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

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

4

1 回答 1

0

I think perhaps that this problem is solved purely on the front end, no need to use any server side for this.

Jcrop has a built in scale factor handler.

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

Now you can use this in two ways, as I understand it. Either to 'resize' the image for you on the front end using 'box sizing', or you can tell it the 'truesize' of the image and it will work out the scale factor and handle the coordinates for you on it's own.

Box sizing 

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

True Size

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

Using the true size method you will need to invoke jcrop using the api method: http://deepliquid.com/content/Jcrop_API.html#API_Invocation_Method

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

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

Good luck!

于 2013-03-28T19:27:13.930 回答