

# Displaying bounding boxes
<a name="images-displaying-bounding-boxes"></a>

Amazon Rekognition Image operations can return bounding boxes coordinates for items that are detected in images. For example, the [DetectFaces](https://docs.aws.amazon.com/rekognition/latest/APIReference/API_DetectFaces.html) operation returns a bounding box ([BoundingBox](https://docs.aws.amazon.com/rekognition/latest/APIReference/API_BoundingBox.html)) for each face detected in an image. You can use the bounding box coordinates to display a box around detected items. For example, the following image shows a bounding box surrounding a face.

![\[Smiling young woman wearing glasses, with bubbles around her.\]](http://docs.aws.amazon.com/rekognition/latest/dg/images/face.png)


A `BoundingBox` has the following properties:
+ Height – The height of the bounding box as a ratio of the overall image height.
+ Left – The left coordinate of the bounding box as a ratio of overall image width.
+ Top – The top coordinate of the bounding box as a ratio of overall image height.
+ Width – The width of the bounding box as a ratio of the overall image width.

Each BoundingBox property has a value between 0 and 1. Each property value is a ratio of the overall image width (`Left` and `Width`) or height (`Height` and `Top`). For example, if the input image is 700 x 200 pixels, and the top-left coordinate of the bounding box is 350 x 50 pixels, the API returns a `Left` value of 0.5 (350/700) and a `Top` value of 0.25 (50/200). 

The following diagram shows the range of an image that each bounding box property covers.

![\[A graphic depicting how a bounding box relates to the dimensions of an image.\]](http://docs.aws.amazon.com/rekognition/latest/dg/images/bounding-box.png)


To display the bounding box with the correct location and size, you have to multiply the BoundingBox values by the image width or height (depending on the value you want) to get the pixel values. You use the pixel values to display the bounding box. For example, the pixel dimensions of the previous image are 608 width x 588 height. The bounding box values for the face are: 

```
BoundingBox.Left: 0.3922065
BoundingBox.Top: 0.15567766
BoundingBox.Width: 0.284666
BoundingBox.Height: 0.2930403
```

The location of the face bounding box in pixels is calculated as follows: 

`Left coordinate = BoundingBox.Left (0.3922065) * image width (608) = 238`

`Top coordinate = BoundingBox.Top (0.15567766) * image height (588) = 91`

`Face width = BoundingBox.Width (0.284666) * image width (608) = 173`

`Face height = BoundingBox.Height (0.2930403) * image height (588) = 172`

You use these values to display a bounding box around the face.

**Note**  
An image can be orientated in various ways. Your application might need to rotate the image to display it with the correction orientation. Bounding box coordinates are affected by the orientation of the image. You might need to translate the coordinates before you can display a bounding box at the right location. For more information, see [Getting image orientation and bounding box coordinates](images-orientation.md).

The following examples show how to display a bounding box around faces that are detected by calling [DetectFaces](https://docs.aws.amazon.com/rekognition/latest/APIReference/API_DetectFaces.html). The examples assume that the images are oriented to 0 degrees. The examples also show how to download the image from an Amazon S3 bucket. 

**To display a bounding box**

1. If you haven't already:

   1. Create or update a user with `AmazonRekognitionFullAccess` and `AmazonS3ReadOnlyAccess` permissions. For more information, see [Step 1: Set up an AWS account and create a User](setting-up.md#setting-up-iam).

   1. Install and configure the AWS CLI and the AWS SDKs. For more information, see [Step 2: Set up the AWS CLI and AWS SDKs](setup-awscli-sdk.md).

1. Use the following examples to call the `DetectFaces` operation.

------
#### [ Java ]

   Change the value of `bucket` to the Amazon S3 bucket that contains the image file. Change the value of `photo` to the file name of an image file (.jpg or .png format).

   ```
    
   //Loads images, detects faces and draws bounding boxes.Determines exif orientation, if necessary.
   package com.amazonaws.samples;
   
   //Import the basic graphics classes.
   import java.awt.*;
   import java.awt.image.BufferedImage;
   import java.util.List;
   import javax.imageio.ImageIO;
   import javax.swing.*;
   
   import com.amazonaws.services.rekognition.AmazonRekognition;
   import com.amazonaws.services.rekognition.AmazonRekognitionClientBuilder;
   
   import com.amazonaws.services.rekognition.model.BoundingBox;
   import com.amazonaws.services.rekognition.model.DetectFacesRequest;
   import com.amazonaws.services.rekognition.model.DetectFacesResult;
   import com.amazonaws.services.rekognition.model.FaceDetail;
   import com.amazonaws.services.rekognition.model.Image;
   import com.amazonaws.services.rekognition.model.S3Object;
   import com.amazonaws.services.s3.AmazonS3;
   import com.amazonaws.services.s3.AmazonS3ClientBuilder;
   import com.amazonaws.services.s3.model.S3ObjectInputStream;
   
   // Calls DetectFaces and displays a bounding box around each detected image.
   public class DisplayFaces extends JPanel {
   
       private static final long serialVersionUID = 1L;
   
       BufferedImage image;
       static int scale;
       DetectFacesResult result;
   
       public DisplayFaces(DetectFacesResult facesResult, BufferedImage bufImage) throws Exception {
           super();
           scale = 1; // increase to shrink image size.
   
           result = facesResult;
           image = bufImage;
   
           
       }
       // Draws the bounding box around the detected faces.
       public void paintComponent(Graphics g) {
           float left = 0;
           float top = 0;
           int height = image.getHeight(this);
           int width = image.getWidth(this);
   
           Graphics2D g2d = (Graphics2D) g; // Create a Java2D version of g.
   
           // Draw the image.
           g2d.drawImage(image, 0, 0, width / scale, height / scale, this);
           g2d.setColor(new Color(0, 212, 0));
   
           // Iterate through faces and display bounding boxes.
           List<FaceDetail> faceDetails = result.getFaceDetails();
           for (FaceDetail face : faceDetails) {
               
               BoundingBox box = face.getBoundingBox();
               left = width * box.getLeft();
               top = height * box.getTop();
               g2d.drawRect(Math.round(left / scale), Math.round(top / scale),
                       Math.round((width * box.getWidth()) / scale), Math.round((height * box.getHeight())) / scale);
               
           }
       }
   
   
       public static void main(String arg[]) throws Exception {
   
           String photo = "photo.png";
           String bucket = "bucket";
           int height = 0;
           int width = 0;
   
           // Get the image from an S3 Bucket
           AmazonS3 s3client = AmazonS3ClientBuilder.defaultClient();
   
           com.amazonaws.services.s3.model.S3Object s3object = s3client.getObject(bucket, photo);
           S3ObjectInputStream inputStream = s3object.getObjectContent();
           BufferedImage image = ImageIO.read(inputStream);
           DetectFacesRequest request = new DetectFacesRequest()
                   .withImage(new Image().withS3Object(new S3Object().withName(photo).withBucket(bucket)));
   
           width = image.getWidth();
           height = image.getHeight();
   
           // Call DetectFaces    
           AmazonRekognition amazonRekognition = AmazonRekognitionClientBuilder.defaultClient();
           DetectFacesResult result = amazonRekognition.detectFaces(request);
           
           //Show the bounding box info for each face.
           List<FaceDetail> faceDetails = result.getFaceDetails();
           for (FaceDetail face : faceDetails) {
   
               BoundingBox box = face.getBoundingBox();
               float left = width * box.getLeft();
               float top = height * box.getTop();
               System.out.println("Face:");
   
               System.out.println("Left: " + String.valueOf((int) left));
               System.out.println("Top: " + String.valueOf((int) top));
               System.out.println("Face Width: " + String.valueOf((int) (width * box.getWidth())));
               System.out.println("Face Height: " + String.valueOf((int) (height * box.getHeight())));
               System.out.println();
   
           }
   
           // Create frame and panel.
           JFrame frame = new JFrame("RotateImage");
           frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
           DisplayFaces panel = new DisplayFaces(result, image);
           panel.setPreferredSize(new Dimension(image.getWidth() / scale, image.getHeight() / scale));
           frame.setContentPane(panel);
           frame.pack();
           frame.setVisible(true);
   
       }
   }
   ```

------
#### [ Python ]

   Change the value of `bucket` to the Amazon S3 bucket that contains the image file. Change the value of `photo` to the file name of an image file (.jpg or .png format). Replace the value of `profile_name` in the line that creates the Rekognition session with the name of your developer profile.

   ```
   import boto3
   import io
   from PIL import Image, ImageDraw
   
   def show_faces(photo, bucket):
   
       session = boto3.Session(profile_name='profile-name')
       client = session.client('rekognition')
   
       # Load image from S3 bucket
       s3_connection = boto3.resource('s3')
       s3_object = s3_connection.Object(bucket, photo)
       s3_response = s3_object.get()
   
       stream = io.BytesIO(s3_response['Body'].read())
       image = Image.open(stream)
   
       # Call DetectFaces
       response = client.detect_faces(Image={'S3Object': {'Bucket': bucket, 'Name': photo}},
                                      Attributes=['ALL'])
   
       imgWidth, imgHeight = image.size
       draw = ImageDraw.Draw(image)
   
       # calculate and display bounding boxes for each detected face
       print('Detected faces for ' + photo)
       for faceDetail in response['FaceDetails']:
           print('The detected face is between ' + str(faceDetail['AgeRange']['Low'])
                 + ' and ' + str(faceDetail['AgeRange']['High']) + ' years old')
   
           box = faceDetail['BoundingBox']
           left = imgWidth * box['Left']
           top = imgHeight * box['Top']
           width = imgWidth * box['Width']
           height = imgHeight * box['Height']
   
           print('Left: ' + '{0:.0f}'.format(left))
           print('Top: ' + '{0:.0f}'.format(top))
           print('Face Width: ' + "{0:.0f}".format(width))
           print('Face Height: ' + "{0:.0f}".format(height))
   
           points = (
               (left, top),
               (left + width, top),
               (left + width, top + height),
               (left, top + height),
               (left, top)
   
           )
           draw.line(points, fill='#00d400', width=2)
   
           # Alternatively can draw rectangle. However you can't set line width.
           # draw.rectangle([left,top, left + width, top + height], outline='#00d400')
   
       image.show()
   
       return len(response['FaceDetails'])
   
   def main():
       bucket = "bucket-name"
       photo = "photo-name"
       faces_count = show_faces(photo, bucket)
       print("faces detected: " + str(faces_count))
   
   if __name__ == "__main__":
       main()
   ```

------
#### [ Java V2 ]

   This code is taken from the AWS Documentation SDK examples GitHub repository. See the full example [here](https://github.com/awsdocs/aws-doc-sdk-examples/blob/master/javav2/example_code/rekognition/src/main/java/com/example/rekognition/DisplayFacesFrame.java).

   Note that `s3` refers to the AWS SDK Amazon Amazon S3 client and `rekClient` refers to the AWS SDK Amazon Rekognition client. 

   ```
   //snippet-start:[rekognition.java2.detect_labels.import]
   import java.awt.*;
   import java.awt.image.BufferedImage;
   import java.io.ByteArrayInputStream;
   import java.io.FileNotFoundException;
   import java.io.IOException;
   import java.io.InputStream;
   import java.util.List;
   import javax.imageio.ImageIO;
   import javax.swing.*;
   import software.amazon.awssdk.auth.credentials.ProfileCredentialsProvider;
   import software.amazon.awssdk.core.ResponseBytes;
   import software.amazon.awssdk.core.SdkBytes;
   import software.amazon.awssdk.regions.Region;
   import software.amazon.awssdk.services.rekognition.model.Attribute;
   import software.amazon.awssdk.services.rekognition.model.BoundingBox;
   import software.amazon.awssdk.services.rekognition.model.DetectFacesRequest;
   import software.amazon.awssdk.services.rekognition.model.DetectFacesResponse;
   import software.amazon.awssdk.services.rekognition.model.FaceDetail;
   import software.amazon.awssdk.services.rekognition.model.Image;
   import software.amazon.awssdk.services.rekognition.model.RekognitionException;
   import software.amazon.awssdk.services.s3.S3Client;
   import software.amazon.awssdk.services.rekognition.RekognitionClient;
   import software.amazon.awssdk.services.s3.model.GetObjectRequest;
   import software.amazon.awssdk.services.s3.model.GetObjectResponse;
   import software.amazon.awssdk.services.s3.model.S3Exception;
   //snippet-end:[rekognition.java2.detect_labels.import]
   
   /**
   * Before running this Java V2 code example, set up your development environment, including your credentials.
   *
   * For more information, see the following documentation topic:
   *
   * https://docs.aws.amazon.com/sdk-for-java/latest/developer-guide/get-started.html
   */
   public class DisplayFaces extends JPanel {
   
       static DetectFacesResponse result;
       static BufferedImage image;
       static int scale;
   
       public static void main(String[] args) throws Exception {
   
           final String usage = "\n" +
               "Usage: " +
               "   <sourceImage> <bucketName>\n\n" +
               "Where:\n" +
               "   sourceImage - The name of the image in an Amazon S3 bucket (for example, people.png). \n\n" +
               "   bucketName - The name of the Amazon S3 bucket (for example, amzn-s3-demo-bucket). \n\n";
   
           if (args.length != 2) {
               System.out.println(usage);
               System.exit(1);
           }
   
           String sourceImage = args[0];
           String bucketName = args[1];
           Region region = Region.US_EAST_1;
           S3Client s3 = S3Client.builder()
               .region(region)
               .credentialsProvider(ProfileCredentialsProvider.create("profile-name"))
               .build();
   
           RekognitionClient rekClient = RekognitionClient.builder()
               .region(region)
               .credentialsProvider(ProfileCredentialsProvider.create("profile-name"))
               .build();
   
           displayAllFaces(s3, rekClient, sourceImage, bucketName);
           s3.close();
           rekClient.close();
       }
   
       // snippet-start:[rekognition.java2.display_faces.main]
       public static void displayAllFaces(S3Client s3,
                                          RekognitionClient rekClient,
                                          String sourceImage,
                                          String bucketName) {
           int height;
           int width;
           byte[] data = getObjectBytes (s3, bucketName, sourceImage);
           InputStream is = new ByteArrayInputStream(data);
   
           try {
               SdkBytes sourceBytes = SdkBytes.fromInputStream(is);
               image = ImageIO.read(sourceBytes.asInputStream());
               width = image.getWidth();
               height = image.getHeight();
   
               // Create an Image object for the source image
               software.amazon.awssdk.services.rekognition.model.Image souImage = Image.builder()
                   .bytes(sourceBytes)
                   .build();
   
               DetectFacesRequest facesRequest = DetectFacesRequest.builder()
                   .attributes(Attribute.ALL)
                   .image(souImage)
                   .build();
   
               result = rekClient.detectFaces(facesRequest);
   
               // Show the bounding box info for each face.
               List<FaceDetail> faceDetails = result.faceDetails();
               for (FaceDetail face : faceDetails) {
                   BoundingBox box = face.boundingBox();
                   float left = width * box.left();
                   float top = height * box.top();
                   System.out.println("Face:");
   
                   System.out.println("Left: " + (int) left);
                   System.out.println("Top: " + (int) top);
                   System.out.println("Face Width: " + (int) (width * box.width()));
                   System.out.println("Face Height: " + (int) (height * box.height()));
                   System.out.println();
               }
   
               // Create the frame and panel.
               JFrame frame = new JFrame("RotateImage");
               frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
               DisplayFaces panel = new DisplayFaces(image);
               panel.setPreferredSize(new Dimension(image.getWidth() / scale, image.getHeight() / scale));
               frame.setContentPane(panel);
               frame.pack();
               frame.setVisible(true);
   
           } catch (RekognitionException | FileNotFoundException e) {
               System.out.println(e.getMessage());
               System.exit(1);
           } catch (IOException e) {
              e.printStackTrace();
           }
       }
   
       public static byte[] getObjectBytes (S3Client s3, String bucketName, String keyName) {
   
           try {
               GetObjectRequest objectRequest = GetObjectRequest
                   .builder()
                   .key(keyName)
                   .bucket(bucketName)
                   .build();
   
               ResponseBytes<GetObjectResponse> objectBytes = s3.getObjectAsBytes(objectRequest);
               return objectBytes.asByteArray();
   
           } catch (S3Exception e) {
               System.err.println(e.awsErrorDetails().errorMessage());
               System.exit(1);
           }
           return null;
       }
   
       public DisplayFaces(BufferedImage bufImage) {
           super();
           scale = 1; // increase to shrink image size.
           image = bufImage;
       }
   
       // Draws the bounding box around the detected faces.
       public void paintComponent(Graphics g) {
           float left;
           float top;
           int height = image.getHeight(this);
           int width = image.getWidth(this);
           Graphics2D g2d = (Graphics2D) g; // Create a Java2D version of g.
   
           // Draw the image
           g2d.drawImage(image, 0, 0, width / scale, height / scale, this);
           g2d.setColor(new Color(0, 212, 0));
   
           // Iterate through the faces and display bounding boxes.
           List<FaceDetail> faceDetails = result.faceDetails();
           for (FaceDetail face : faceDetails) {
               BoundingBox box = face.boundingBox();
               left = width * box.left();
               top = height * box.top();
               g2d.drawRect(Math.round(left / scale), Math.round(top / scale),
                       Math.round((width * box.width()) / scale), Math.round((height * box.height())) / scale);
           }
       }
       // snippet-end:[rekognition.java2.display_faces.main]
   }
   ```

------