ディストート
distort
distort パラメーターは、画像の4つの角をそれぞれ指定した位置に移動させ、遠近法やキーストーンのワープを作り出します。角度を付けて撮影された面にアートワークを合わせる場合に使用するパラメーターです。
構文
distort は8つの数値をカンマ区切りで受け取ります。左上から時計回りに、各角のxとyを指定します。
distort=x1,y1,x2,y2,x3,y3,x4,y4座標はピクセルではなく画像に対する割合です。そのため distort=0,0,1,0,1,1,0,1 はすべての角を元の位置に配置することになり、何も変化しません。0〜1の範囲外の値を指定すると、その角は元の端を越えた位置に引き出され、キャンバスはその分だけ拡張されます。値は -1〜2 の範囲に丸められます。
数値がちょうど8つでない値は不正とみなされ、無視されたうえ X-Imgix-Params レスポンスヘッダーからも除外されます。自己交差する形状や凸でない形状など、ワープが描画できない形状の場合は、パラメーターが指定されていないかのようにレンダリングされますが、X-Imgix-Params には残ります。
レイヤー形式
mark-distort と blend-distort は、元画像ではなくレイヤーをワープさせます。どちらも blend-distort[1] のようなインデックス付きの指定に対応しています。
レイヤーの場合、8つの数値は元画像上の点を、元画像に対する割合で指定します。モックアップが成立するのはこの仕組みによるもので、4つの角がデザインを配置すべき商品写真上の領域を指定します。角の位置によって配置が完全に決まるため、mark-distort は mark-x、mark-y、mark-align を置き換えます。
mark-tile は mark-distort を無視します。
処理の順序と出力
ワープは rect によるクロップと rot の後、リサイズの前に実行されます。そのため w と h は最終的な出力サイズのままです。
ワープされた形状の外側の領域は透明になります。透明度に対応していないフォーマットでは bg で塗りつぶされ、bg が指定されていない場合は黒になります。Web向けにワープを使用する場合は fm=png または bg の色を指定してください。
ワープはアニメーションGIFやPDFのページにも適用できます。8192pxのキャンバス上限を超えるワープは、拒否されるのではなく縮小されます。