function processImage(originalImg, baseDimension = 'width') {
const canvas = document.createElement('canvas');
let targetWidth, targetHeight;
// Determine the new dimensions to enforce a 20:9 aspect ratio
if (baseDimension.toLowerCase() === 'height') {
targetHeight = originalImg.height;
targetWidth = Math.round(targetHeight * (20 / 9));
} else {
// Default to using the original width as the base
targetWidth = originalImg.width;
targetHeight = Math.round(targetWidth * (9 / 20));
}
canvas.width = targetWidth;
canvas.height = targetHeight;
const ctx = canvas.getContext('2d');
// Drawing the image to the new dimensions will automatically stretch it
// ignoring its original aspect ratio.
ctx.drawImage(originalImg, 0, 0, targetWidth, targetHeight);
return canvas;
}The Image Aspect Ratio 20:9 Stretch Tool allows users to modify an image to fit a specific 20:9 aspect ratio. By choosing to base the transformation on either the image’s original width or height, the tool stretches the image to match the target dimensions. This utility is useful for creators needing to quickly format content for specific mobile device displays, digital signage, or cinematic-style aspect ratios where precise dimension stretching is required.