Skip to main content

图片缩放处理说明

图片缩放功能可以对原图大小进行调整。本文介绍图片缩放功能的参数说明及使用示例。

以下例子中,默认原图均为:https://fanfan.s3.bitiful.net/girl.jpeg

参数说明

相关参数总览

参数含义作用说明
w指定宽度系统将图片宽度缩小到 w 的值。
h指定高度系统将图片高度缩小到 h 的值。
dpr额外缩放比- 默认:1,代表不缩放
- 范围:0.01 ~ 10,该参数为额外缩放系数
mode指定缩略模式- crop:裁切模式
- clip:等比模式
pos指定裁剪保留位置- center:居中(默认)
- top:保留中间和上侧
- bottom:保留中间和下侧
- left:保留中间和左侧
- right:保留中间和右侧
- top-left:保留上侧和左侧
- top-right:保留上侧和右侧
- bottom-left:保留下侧和左侧
- bottom-right:保留下侧和右侧
- top-center:保留居中偏上侧
- bottom-center:保留居中偏下侧
- left-center:保留居中偏左侧
- right-center:保留居中偏右侧

用例说明

  • 单独设定 w 或 h
    • 若单独指定 w 参数(不指定 h):系统会按 等比模式(mode=clip) 将图片等比缩小为 宽度为 w 大小的缩略图。
    • 若单独指定 h 参数(不指定 w):系统会按 等比模式(mode=clip) 将图片等比缩小为 高度为 h 大小的缩略图。
  • 同时设定 w 和 h
    • 系统会自动按裁切模式(mode=crop) 将图片强行裁剪 为 w、h 设定大小的缩略图,默认取中间部分,丢弃多余部分。
  • 同时设定 w 和 h,且指定 mode 为 clip
    • 系统会自动按最小模式(mode=clip) 将图片等比缩略 到 w、h 的矩形盒子内,即:缩略图的长、宽均不会超过设定的 w、h 值。
  • 设定 dpr
    • 以上面 w=300&h=300 为例:
      • dpr=2 时:系统会生成 600x600 的正方形缩略图
      • dpr=0.5 时:系统会生成 150x150 的正方形缩略图
演示:指定缩放宽度为 w=200,进行等比缩放(此时 mode 强制为 clip)
演示:指定缩放高度为 h=200,进行等比缩放(此时 mode 强制为 clip)
演示:同时指定宽高 w=200 & h=200(此时 mode 默认为 crop;pos 默认为 center)
处理逻辑示例

crop-mode-demo-1.png

加上参数后 URL:https://fanfan.s3.bitiful.net/girl.jpeg? w=200 & h=200

girl.resize.jpg

演示:同时指定宽高 w=200 & h=200 并设置 mode=clip
演示:同时指定宽高 w=200 & h=200 并设置 dpr=0.5
演示:同时指定宽高 w=200 & h=200 并设置 pos=top
演示:同时指定宽高 w=200 & h=200 并设置 pos=bottom