生成塗りつぶし位置
fill-gen-pos
プレミアム機能
生成塗りつぶし位置は、現在 imgix のプレミアムプランのお客様にご利用いただけます。この機能に興味がある場合は、弊社の営業チーム (opens in a new tab)にお問い合わせください。
fit=fill&fill=gen
を使用したときの生成塗りつぶしの配置を指定します。
生成塗りつぶしを水平方向および垂直方向に配置できます。水平方向の有効な値は middle
、left
、right
です。垂直方向の有効な値は center
、top
、bottom
です。
複数の値はカンマ (,
) で区切ることができます。値が明示的に設定されていない場合、デフォルト値は middle,center
です。パラメーターの優先順位は、右から左に設定されます。つまり、最後のパラメーター値が以前のパラメーターより優先されます。
水平方向の配置
middle
、left
、right
の値を使用すると、元の画像の開始位置と生成塗りつぶしの追加位置を指定できます。たとえば、fill-gen-pos=left
は、元の画像の塗りつぶしを左に配置し、画像の右側に生成塗りつぶしを追加します。
元の画像:
https://assetmanager.imgix.net/picography-mountain-waterfall-bridge-768x960.jpg
fill-gen-pos=left
を使用した同じ画像:
https://assets.imgix.net/combined-gen-fill.jpg?auto=format&mark64=aHR0cDovL2Fzc2V0cy5pbWdpeC5uZXQvdGV4dC1iYWNrZ3JvdW5kLnBuZz9tYXNrPWNvcm5lcnMmY29ybmVyLXJhZGl1cz0wLDAsMCw3JnR4dDY0PVAyZGxibVZ5WVhScGRtVXRjRzl6YVhScGIyNDliR1ZtZEE9PSZ0eHQtY29sb3I9RkZGRkZGJnR4dC1maXQ9bWF4JnR4dC1hbGlnbj1jZW50ZXIsbWlkZGxlJnR4dC1zaXplPTM2JnR4dC1mb250PU1lbmw=&mark-scale=20&mark-pad=-1&mark-align=top%2Cright&fm=png&ixlib=react-9.7.0&w=1100&h=750&dpr=2&q=50
垂直方向の配置
center
、top
、bottom
の値を使用すると、元の画像の開始位置と生成塗りつぶしの追加位置を指定できます。たとえば、fill=gen-pos=bottom
は、画像の塗りつぶしを上部および中央に追加します。以下は、fill=gen-pos=bottom
を使用した画像の例です。
元の画像:
https://assetmanager.imgix.net/testing-gen-fill-bottom.jpeg?ar=15:7&w=1200
fill-gen-pos=bottom
を使用した同じ画像:
https://assetmanager.imgix.net/testing-gen-fill-bottom.jpeg?fit=fill&fill=generative&ar=15:7&fill-gen-pos=bottom&w=1200