Operations - Image Scaling

Image Operations / Cropping

Image cropping is a powerful tool in digital image processing, allowing you to eliminate unwanted portions of an image or to highlight the most engaging segments. The Optidash Image API facilitates versatile cropping options to accommodate various requirements. It introduces three distinct cropping modes: rect, ratio and face, each designed to offer flexibility and precision in image editing.

Rect

This mode allows you to extract a rectangular portion of the image by providing the width and height of the fragment you'd like to extract, and optionally a gravity parameter. The default crop gravity is center, and you may use one of the following values: top-left, top, top-right, right, bottom-right, bottom, bottom-left, or left.

{
    "crop": {
        "mode": "rect",
        "width": 375,
        "height": 150,
        "gravity": "center"
    }
}

If you know the exact position of the fragment you'd like to extract, you may ignore the gravity parameter and specify x and y coordinates. The 0,0 point (the origin) is located at the top-left corner of the image.

{
    "crop": {
        "mode": "rect",
        "width": 375,
        "height": 150,
        "x": 340,
        "y": 100
    }
}

Practical applications:

  • Custom User-Generated Content: Allows for the creation of user-centric cropping tools within applications, enabling users to specify exact crop areas for personalized content creation.
  • Data Visualization: Useful in cropping images to fit into specific data visualization formats where precise alignment and positioning are crucial for the intended narrative or analytical purpose.

Ratio

This mode allows you to specify the aspect ratio of the resulting image. The Optidash API will automatically calculate the width and height based on the provided ratio parameter.

Along with ratio cropping, you may optionally provide a gravity parameter. The default crop gravity value is center, and you may use one of the following values: top-left, top, top-right, right, bottom-right, bottom, bottom-left, and left.

In order to use ratio cropping simply set mode to ratio within the crop hash and pass the desired aspec ratio string as a value for the ratio key:

{
    "crop": {
        "mode": "ratio",
        "ratio": "5:9"
    }
}

The aspect ratio of 1:1 will produce square image, which is a great choice for social media and grid layouts:

{
    "crop": {
        "mode": "ratio",
        "ratio": "1:1"
    }
}

You can excercise even more control over aspect ratio cropping by providing an extra gravity parameter:

{
    "crop": {
        "mode": "ratio",
        "ratio": "4:3",
        "gravity": "left"
    }
}

Practical applications:

  • Perfect for creating uniform image collections, ensuring visual consistency across web pages, social media platforms, or product galleries.
  • Tailor images for specific display formats, from square thumbnails to widescreen backgrounds, without losing the essence of the visual content.

Face

Face mode introduces an intelligent cropping solution that utilizes advanced face detection algorithms to automatically identify and focus on faces within images. This mode is invaluable for personalizing user experiences, enhancing social media engagement, or any application where the human element is key.

Customize how tightly or loosely the crop frames the detected face(s) by specifying a padding parameter. This integer value adjusts the distance between the face and the image bounds, allowing for a more spacious or intimate framing based on your needs.

Activate face detection cropping by setting the mode to face in your crop hash. Optionally, adjust the padding to control the framing around detected faces, ensuring the output image captures the desired context and emotion.

{
    "crop": {
        "mode": "face",
        "padding": 100
    }
}

Practical applications:

  • Ideal for profile pictures, where the focus is on the individual, providing a clear, centered view of the person.
  • Enhances user engagement by emphasizing human elements in social media posts, marketing materials, or any visual content where faces are a focal point.