imgix APIsレンダリング APIサイズリサイズフィットモード

リサイズフィットモード

fit

fit パラメータは、リサイズ後の出力画像が目標の寸法に合うように制御し、どのように背景領域が埋められるかを制御します。

有効な値は clamp, clip, crop, facearea, fill, fillmax, max, min, scale です。デフォルト値は clip です。

fit=clamp

画像を切り取ることなく幅と高さの寸法内に収め、残りの空間は画像の端からの拡張ピクセルで埋めます。結果の画像は制約寸法と一致します。

clampの動作例

fit=clip

デフォルト。画像を切り取ることなく、幅と高さの境界内に収まるようにリサイズします。結果の画像は、1つの制約寸法に合致し、他の寸法は入力画像のアスペクト比を維持するように変更されます。

clipの動作例

  • 未設定: これはパラメータが適用されていない、300×200の元画像です。clip がデフォルトなので、必要ありません。

    元の画像

  • fit=clip&w=100&h=100: この画像を 100×100 にリサイズしようとすると、元の画像のアスペクト比が維持されるため、100×67 の画像になります。

    クリップされた画像

fit=crop

画像を幅と高さの寸法に合わせてリサイズし、余分な画像データを切り取ります。結果の画像は、画像を歪めることなく幅と高さの制約に一致します。

cropの動作例

  • 未設定: デフォルト。これはパラメータが適用されていない、300×200 の元画像です。

    元の画像

  • fit=crop&w=300&h=100: 300×100 に画像をリサイズすると、画像はその寸法に完全に合います。

    クロップされた画像

  • fit=crop&w=200&h=200: 幅と高さが等しい値を設定し、fit=crop を設定すると、常に正方形の画像が生成されます。クロップされた画像のコンテンツの位置を調整するには、crop モードパラメータを確認してください。

    正方形にクロップされた画像

fit=facearea

画像内のすべての顔、または特定の顔を特定して、それを指定された幅と高さの寸法にスケーリングします。 faceindex と組み合わせて、画像内の特定の顔を識別することができます。また、facepad を使用して、顔の周囲の追加の余白領域を含めることもできます。

faceareaの動作例

  • 未設定: デフォルト。これは顔領域のクロッピングがされていない画像全体で、300×200 にリサイズされた画像です。

    元の画像

  • fit=facearea&w=300&h=200: 顔ができるだけ中心になるように、画像をクロップして 300×200 にリサイズします。出力は、出力のアスペクト比と顔領域の可用性に応じて、正しい要求されたサイズです。

    中心に配置された顔のクロップされた画像

  • fit=facearea&faceindex=2&facepad=1.5&w=300&h=300: faceindexfacepad パラメータを使用して画像内の顔を選択し、拡大するために使用されます。

    顔が選択された画像

フォールバックパラメータは、fit=facearea に加えて設定できます。たとえば、fit=facearea,fill の組み合わせを使用できます。画像内で顔が検出されない場合、画像はクロップされずに代わりに画像が fill されます。関連するパラメータを URL に追加して、フォールバック動作を変更できます。

fit=fill

オリジナルのアスペクト比を保持しながら、要求された幅と高さの寸法内に画像をリサイズします。余分なスペースは、画像の塗りつぶしの色またはぼかしバージョンで埋められます。結果の画像は要求された寸法と完全に一致します。

fillの動作例 塗りつぶしの説明

これらの特性を実現しつつ、画像をオリジナルの寸法を超えることなくサイズ変更するには、fit=fillmax を参照してください。

  • 未設定: w=250&h=250fit モードが設定されていないため、300×200 の画像を 250×250 にリサイズするリクエストは、250×167 の出力画像になります。オリジナルのアスペクト比は保持されますが、結果の画像は要求された寸法と完全に一致しません。

    fitモード未指定でのリサイズ

  • 単色: fit=fill&fill=solid&fill-color=360036&w=250&h=250。250×250 にリサイズされた画像で、元の画像が自動的に中央に配置され、余分なスペースは指定された単色で埋められます。

    fillとfill=solidでのリサイズ

    fill-color が指定されていない場合、余分なスペースは画像出力形式が透明性をサポートするかどうかに応じて白または透明になります。

  • ぼかし: fit=fill&fill=blur&w=250&h=250。250×250 にリサイズされた画像で、余分なスペースは元の画像のぼかしバージョンで埋められます。

    fillとfill=blurでのリサイズ

fit=fillmax

オリジナルのアスペクト比を保持しながら、要求された幅と高さの寸法内に画像をリサイズします。元の画像の幅または高さを超える場合、オリジナルの画像は同じサイズのままです。余分なスペースは、画像の塗りつぶしの色またはぼかしバージョンで埋められます。結果の画像は要求された寸法と完全に一致します。

fillmaxの動作例 塗りつぶしの説明

fit=fillmax は、元の画像を拡大することに制約を課しますが、fit=fill は制約を課しません。これにより、時には画像品質が低下することがあります。

  • 単色: fit=fillmax&fill=solid&fill-color=28285D&w=400&h=300。元の 300×200 の画像が 400×300 にリサイズされ、元の画像よりも大きくなります。オリジナルの画像が自動的に中央に配置され、余分なスペースは指定された単色で埋められます。

    fillmaxとfill=solidでのリサイズ

    fill-color が指定されていない場合、余分なスペースは画像出力形式が透明性をサポートするかどうかに応じて白または透明になります。

  • ぼかし: fit=fillmax&fill=blur&w=400&h=300。400×300 にリサイズされた画像で、余分なスペースは元の画像のぼかしバージョンで埋められます。

    fillmaxとfill=blurでのリサイズ

fit=max

画像を切り取ることなく幅と高さの寸法内に収め、画像が出力サイズより小さい場合は画像のサイズを拡大しません。結果の画像は入力画像のアスペクト比を維持します。

maxの動作例 maxの説明

  • 未設定: デフォルト。これはパラメータが適用されていない、300×200 の元画像です。

    元の画像

  • fit=max&w=500&h=300: 500×300 にリサイズしようとすると、結果は 300×200 の画像になります。max を適用しても画像は拡大されません。

    fit=maxを適用した画像

  • fit=max&w=200&h=400: 200×400 にリサイズしようとすると、200×133 の画像になります。この動作は clip にやや似ています。

    境界外にリサイズされた画像

fit=min

要求された幅と高さのアスペクト比に一致するように画像をリサイズし、元の幅と高さを超えることはありません。

minの動作例

  • 未設定: デフォルト。これはパラメータが適用されていない、300×200 の元画像です。

    元の画像

  • fit=min&w=500&h=200: 500×200にリサイズしようとすると、画像が300×120になります。要求されたアスペクト比が保持され、画像は切り取られますが、画像は元のサイズを超えません。

    fit=minを適用した画像

  • fit=min&w=200&h=400: 200×400にリサイズしようとすると、100×200の画像になります。要求されたアスペクト比が保持され、画像は切り取られますが、画像は元のサイズを超えません。

    fit=minを適用した画像

fit=scale

画像を要求された幅と高さの寸法内にリサイズし、そのサイズが超える場合は画像を拡大します。アスペクト比は維持されます。

scaleの動作例

  • 未設定: デフォルト。これはパラメータが適用されていない、300×200 の元画像です。

    元の画像

  • fit=scale&w=500&h=100: 500×200 にリサイズしようとすると、画像は寸法に合わせて水平方向に拡大縮小され、歪められます。

    fit=scaleを適用した画像

  • fit=scale&w=100&h=300: 100×300 にリサイズしようとすると、画像は寸法に合わせて垂直方向に拡大縮小され、歪められます

    fit=scaleを適用した画像