AEM Dynamic Media: Preserve aspect ratio when resizing images
This article explains how to ensure that Adobe Experience Manager Dynamic Media image delivery preserves the original aspect ratio when resizing images using width and height parameters.
Description description
Environment
Adobe Experience Manager Dynamic Media (all versions)
Symptoms
When delivering images via the Dynamic Media OpenAPI endpoint and specifying both width and height query parameters, the returned image doesn’t preserve the original aspect ratio. Instead, the output image is forced into a square or uses the smaller dimension for both width and height, resulting in unexpected sizing. This occurs even when the asset’s original dimensions aren’t square.
Example:
- Asset original dimensions: 2336 × 2400 (image/webp)
- Requests and observed results:
?width=1000→ 1000 × 1000?height=1000→ 1000 × 1000?width=1000&height=500→ 500 × 500?width=1500&height=500→ 500 × 500
Expected behavior: The image should be resized to fit within the requested bounding box while maintaining the original aspect ratio (For example: 2336 × 2400 scaled proportionally to fit within 1000 × 500).
Observed behavior: The image output is square or doesn’t match the expected aspect ratio, regardless of the original dimensions.
References:
Resolution resolution
Follow the steps below to resolve the issue:
-
Review the image delivery URL, and ensure you’re specifying the desired
widthandheightparameters. -
To preserve the original aspect ratio and fit the image within the requested bounding box, append the
fit=containparameter to the delivery URL. -
Test the updated URL in a browser or API client. The returned image should now fit within the specified dimensions while maintaining its original aspect ratio (For example: 487 × 500 for a 2336 × 2400 image scaled to fit within 1000 × 500).
-
Refer to the official documentation for further details on supported parameters: