图片等比例缩放

（1）从网上查找的js代码，这段js代码是把图片按照规定的大小等比例不变形缩放后显示的，原图片大小不会变。

<img alt="" src="picture/DSCN1793.JPG"  onload="DrawImage(this);" />

这样在html代码中就不要指定width和height，若是指定的width和height和缩放后的大小不一样，图片就会自动填充满html中指定的width和height，图像就会变形。所以只要在js中指定了缩放后的宽度和高度，html中就不要指定了。

核心思想：oldHeight/oldWidth=newHeight/newWidth.

=》newHeight=oldHeight*newWidth/oldWidth 或者 newWidth=newHeight*oldWidth/oldHeight

 缩放的时候有两种形式：

1、原图片是宽400高300的，而你所要缩放的图片是宽40.高60，也就是（oldHeight/oldWidth>=newHeight/newWidth）,这个时候新图片的宽度就按照，所要求的宽度，新图片的高度

newWidth=newWidth；

newHeight=oldHeight*newWidth/oldWidth;

2、若oldHeight/oldWidth<newHeight/newWidth

newHeight=newHeight;

newWidth=newWidth=newHeight*oldWidth/oldHeight;

View Code

<script type="text/javascript">
        function DrawImage(ImgD) {
            //缩放成照片宽400.高300
            var nWidth = 400;
            var nHeight=300;
            var image = new Image();
            image.src = ImgD.src;
            image.width = ImgD.width;
            image.height = ImgD.height;
            if (image.width > 0 && image.height > 0) {
                //宽度与高度的比例大于或等于要求显示的比例（说明比较宽）
                if (image.width / image.height >= nWidth / nHeight) {
                //如果宽度大于要求显示的宽度
                    if (image.width > nWidth) {
                        ImgD.width = nWidth; //那么图片就显示要显示的宽度
                        ImgD.height = (image.height * nWidth) / image.width; 
                    } else {
                        ImgD.width = image.width;
                        ImgD.height = image.height;
                    }
                }
                else {
                    //说明比较高
                    if (image.height > nHeight) {
                        ImgD.height = nHeight;
                        ImgD.width = (image.width * nHeight) / image.height;
                    } else {
                        ImgD.width = image.width;
                        ImgD.height = image.height;
                    }
                }
            }
        }
        </script>

（2）上传图片的时候，就把图片等比例缩放为指定的大小，生成新的按比例缩放后的图片；

View Code

//oWidth原照片的宽度 oHeight原照片的高度 newW要缩放的宽度 newH 要缩放的高度
public void bili(int oWidth, int oHeight, int newW, int newH)
        {
          
            if (oWidth > 0 && oHeight > 0)
            {
                if (oWidth / oHeight >= newW / newH)
                {
                    if (oWidth > newW)
                    {
                        _tWidth = newW;
                        _tHeight = (oHeight * newW) / oWidth;
                    }
                    else
                    {
                        _tWidth = oWidth;
                        _tHeight = oHeight;
                    }
                }
                else
                {
                    if (_tHeight > newH)
                    {
                        _tHeight = newH;
                        _tWidth = (oWidth * newH) / oHeight;
                    }
                    else
                    {
                        _tWidth = oWidth;
                        _tHeight = oHeight;
                    }
                }
            }
        }

 /// <summary>
        /// Resize图片
        /// </summary>
        /// <param name="bmp">原始Bitmap</param>
        /// <param name="newW">新的宽度</param>
        /// <param name="newH">新的高度</param>
        /// <returns>处理以后的图片</returns>
        public Bitmap KiResizeImage(Bitmap bmp, int newW, int newH)
        {
            try
            {
                Bitmap b = new Bitmap(newW, newH);
                Graphics g = Graphics.FromImage(b);

                // 插值算法的质量
                g.InterpolationMode = InterpolationMode.HighQualityBicubic;
                // 高质量
                g.SmoothingMode = SmoothingMode.HighQuality;

                g.DrawImage(bmp, new Rectangle(0, 0, newW, newH), new Rectangle(0, 0, bmp.Width, bmp.Height), GraphicsUnit.Pixel);
                g.Dispose();

                return b;
            }
            catch
            {
                return null;
            }
        }


/// <summary>
        ///  缩放
        /// </summary>
        /// <param name="imageUrl">图片的路径</param>
        /// <param name="savaPath">保存路径</param>
        /// <param name="newW">新图片的宽度</param>
        /// <param name="newH">新图片的高度</param>
        /// <returns></returns>
        public void KiResizeImage(string imageUrl, string savePath, int newW, int newH)
        {
            System.Drawing.Image image = System.Drawing.Image.FromFile(imageUrl);

            bili(image.Width, image.Height, newW, newH);//比例缩放

            Bitmap NBM = new System.Drawing.Bitmap(image, image.Width, image.Height);
            image = KiResizeImage(NBM, _tWidth, _tHeight, Mode);
            if (File.Exists(savePath))
                File.Delete(savePath);
            image.Save(savePath, ImageFormat.Jpeg);
        }

 

缩放比例的计算和上面的js的一样。