AEM Dynamic Media:画像のサイズ変更時に縦横比を保持

この記事では、幅と高さのパラメーターを使用して画像のサイズを変更する際に、Adobe Experience Manager Dynamic Mediaの画像配信で元の縦横比が維持されるようにする方法について説明します。

説明 description

環境

Adobe Experience Manager Dynamic Media (すべてのバージョン)

症状

Dynamic Media OpenAPI エンドポイントを介して画像を配信し、widthheightの両方のクエリパラメーターを指定する場合、返された画像は元の縦横比を保持しません。 その代わりに、出力イメージは正方形に強制的に配置されるか、幅と高さの両方に小さいサイズを使用して、予期しないサイズ変更が発生します。 これは、アセットの元の寸法が正方形でない場合でも発生します。

例:

  • アセットの元の寸法:2336×2400 (画像/webp)
  • リクエストと監視結果:
  • ?width=1000 → 1000 × 1000
  • ?height=1000 → 1000 × 1000
  • ?width=1000&height=500 → 500 × 500
  • ?width=1500&height=500 → 500 × 500

期待される動作:画像は、元の縦横比を維持しながら、要求されたバウンディングボックス内に収まるようにサイズ変更する必要があります(例:2336 × 2400は、1000 × 500以内に収まるように比例して拡大・縮小されます)。

観察された動作:画像の出力が正方形であるか、元の寸法に関係なく予想される縦横比と一致しません。

参照:

解決策 resolution

問題を解決するには、次の手順に従います。

  1. 画像配信URLを確認し、目的のwidthおよびheight パラメーターを指定していることを確認します。

  2. 元の縦横比を保持し、要求されたバウンディングボックス内に画像を収めるには、配信URLにfit=contain パラメーターを追加します。

  3. ブラウザーまたはAPI クライアントで更新されたURLをテストします。 返された画像は、元の縦横比を維持しながら、指定されたサイズ内に収まるようになりました(例:1000 × 500以内に収まるように拡大・縮小された2336 × 2400の画像の場合は、487 × 500)。

  4. サポートされるパラメーターについて詳しくは、公式ドキュメントを参照してください。

recommendation-more-help
experience-cloud-kcs-help-kbarticles