アスペクト比を維持しつつ、画像の縦横幅を制限するにはどうしたらよいですか？

画像APIのfit=maxを利用することでアスペクト比を維持しつつ、画像の縦横幅を制限できます。

画像APIのfit=maxを利用すると、指定した縦横幅に収まるように画像がリサイズされます。また、このとき元のアスペクト比は維持されます。

具体例

例えば、最大横幅を900px、最大縦幅を600pxに制限したい場合のURLは以下のようになります。

https://images.microcms-assets.io/assets/xxxx/yyyy/{fileName}.png?fit=max&w=900&h=600

このURLにアクセスすると、元の画像のアスペクト比を維持しつつ、縦横幅が指定したサイズ内に収まるようにリサイズされた画像が表示されます。

リサイズの例

• 元の画像のサイズが1200px x 800pxの場合、リサイズ後のサイズは900px x 600pxとなります。
• 元の画像のサイズが1000px x 1500pxの場合、リサイズ後のサイズは400px x 600pxとなります。

補足情報

• wやhを省略した場合、指定している方のサイズに対して、元画像のアスペクト比が適用されて自動的に調整されます。
• 元の画像が指定したサイズよりも小さい場合は、画像のサイズは変更されずに出力されます。