This document provides an introduction and overview of JavaCV, a wrapper that allows accessing the OpenCV library from within Java. It discusses basic JavaCV structures like IplImage and CvPoint for representing images and points. It also covers image I/O functions for loading, saving, and displaying images. Examples of accessing pixel values and drawing on images using functions like cvLine and cvRectangle are presented.
This document provides an introduction and overview of JavaCV, a wrapper that allows accessing the OpenCV library from within Java. It discusses basic JavaCV structures like IplImage and CvPoint for representing images and points. It also covers image I/O functions for loading, saving, and displaying images. Examples of accessing pixel values and drawing on images using functions like cvLine and cvRectangle are presented.
Interfaces - 2013/14 1 From OpenCV to JavaCV An introduction Topics Introduction & overview Basic JavaCV structures & examples Image I/O Basic image operations Examples Example code & how to use them February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 2 OpenCV OpenCV is an Image Processing library created by Intel and maintained by Willow Garage Available for C, C++, and Python Open Source and free http://opencv.org/ Overview OpenCV (Open Source Computer Vision) a library of several hundred algorithms for computer vision and video analysis started in the late 90s as a C library in version 2 a C++ API was added JavaCV is a wrapper it allows accessing the OpenCV library directly from within Java Virtual Machine (JVM) and Android platform February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 3 Overview See the additional lecture notes on QMPlus for OpenCV & JavaCV They cover Installation Configuration Access @ ITL Online documentation Help JavaCV project files & examples http://code.google.com/p/javacv/downloads/detail?name=javacv-0.7-src.zip February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 4 JavaCV: Basic Structures Size - 2D size structure IplImage - image object Point, Point2f - 2D Point Rect - 2D rectangle object Basic Structures: cvSize 2D size structure - int width, height; OpenCV version of the structure Example: CvSize img_size = cvGetSize(image); img_size.width(), img_size.height() February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 5 Basic Structures: IplImage The primary data structure in JavaCV is the IplImage object It stores images and their components Main items rows, cols - length and width(int) channels - 1: grayscale, 3: BGR depth: CV_<depth>C<num chan> For more information see the documentation Representing images A grey-level image can be represented as a matrix each cell representing a pixel of the image cell values usually in the range of [0-255] pixel values are stored row by row February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 6 Representing images A colour image is represented with its components [0-255] [0-255] [0-255] black: ( 0, 0 , 0 ) white: ( 255, 255 , 255 ) Basic Structures: IplImage OpenCV version of the structure http://opencv.willowgarage.com/documentation/basic_structures.html February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 7 IplImage: example cvCreateImage creates interleaved images the channels are interleaved usual data layout of a colour image is b0 g0 r0 b1 g1 r1 ... Example IplImage Image = cvLoadImage(filename); IplImage GrayImage = cvCreateImage(cvGetSize(Image), IPL_DEPTH_8U, 1); IplImage ColourImage = cvCreateImage(cvGetSize(Image), IPL_DEPTH_8U, 3); ... IplImage.width() IplImage.height() Image types Image type is a very important aspect of OpenCV/JavaCV represented as CV_<Datatype>C<# Channels> type will affect what values a pixel can have Example Datatypes/ Depths February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 8 Pixel types How the image is represented in data BGR The default color for capturing from camera (normal 3 channel color) HSV Hue is color, Saturation is amount, Value is lightness (3 channels) GRAYSCALE - Gray values, Single channel JavaCV requires images to be in BGR or Grayscale for showing or saving Converting colour spaces cvtColor( image, image, code) Codes CV_<colorspace>2<colorspace> Examples CV_BGR2GRAY CV_BGR2HSV CV_BGR2LUV February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 9 Basic Structures: cvPoint 2D point object int x_coordinate,y_coordinate; com.googlecode.javacv.jna.cxcore.CvPoint Example:CvPoint p1; p1.x()=5; p1.y()=20; Basic Structures: cvPoint 2D point OpenCV version of the structure http://opencv.willowgarage.com/documentation/basic_structures.html February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 10 Basic Structures: cvRect 2D rectangle structure int x, y, width, height; x co-ordinate of the top left corner y co-ordinate of the top left corner width and height Example:CvRect box; box.x() box.y() box.width() box.height() CvRect rect2=cvRect(box.x,box.y,box.width,box.height); cvSetImageROI(image, rect2); Basic Structures: cvRect 2D rectangle object OpenCV version of the structure http://opencv.willowgarage.com/documentation/basic_structures.html February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 11 Basic Structures: cvMat A multi-channel 2D matrix Example: CvMat imageMat1 = cvCreateMat(imageRows, imageCols, CV_8UC1); Basic Structures: cvMat A multi-channel 2D matrix OpenCV version of the structure http://opencv.willowgarage.com/documentation/basic_structures.html February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 12 Image I/O Loading an image from a file Displaying an image Saving an image to a file Grabbing a frame from camera Loading/saving images JavaCV methods for loading and saving images are based on OpenCV com.googlecode.javacv.cpp.opencv_highgui Images can be loaded as IplImage using cvLoadImage cvLoadImage usually takes one parameter file name (with path information if different from current directory) February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 13 Loading/saving images If image cannot be loaded cvLoadImage will return null check what cvLoadImage returns & whether image can/cannot be loaded Example: IplImage imgA = cvLoadImage("image0.png", CV_LOAD_IMAGE_GRAYSCALE); IplImage imgB = cvLoadImage("image1.png); Loading/saving images cvSaveImage(filename, image) saves the image to the specified file image format is chosen based on the filename extension the method returns an error code February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 14 Displaying images Simplest way to display image using JavaCV is to use cvShowImage It shows the image in a window create an image window named smoothed image show the image wait till a key is pressed Displaying images Another way to display image using JavaCV is to use CanvasFrame February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 15 Accessing Pixel Values Can be done by representing images as a CvMat object. CvMat can access pixels in a couple of ways, different ones are suitable in different situations: by specifying (x,y) or (column, raw) coordinates, for use with gray level images by specifying (x,y,channel) or (column, raw, channel) for color (multichannel) images To iterate over pixels and channel values you need to know number of columns (CvMat.cols), number of rows (CvMat.rows), and number of channels (CvMat.channels) Remember: pixel values are stored row by row Accessing pixel values: Example IplImage image1; CvMat imageMat1 = image1.asCvMat(); int imageCols = imageMat1.cols(); int imageRows = imageMat1.rows(); CvMat imageMat2 = cvCreateMat(imageRows, imageCols, CV_8UC1); // Type matches IPL_DEPTH_8U cvSetZero(imageMat2 ); for(int irow = 0; irow < imageRows; irow++) for(int icol = 0; icol < imageCols; icol++) imageMat2.put(irow, icol, (int) imageMat1.get(irow,icol)); IplImage image2= cvCreateImage(cvSize(imageCols, imageRows), IPL_DEPTH_8U, 1); image2= imageMat2.asIplImage(); What does this code do? February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 16 Capturing image If you don't change any settings, you should get images in 24 bits per pixel BGR format i.e.: 8 bits per channel Remember that rows is your y coordinate and that cols is your x coordinate. Example: // define a grabber OpenCVFrameGrabber grabber = new OpenCVFrameGrabber(0); // start the grabber grabber.start(); // capture an image IplImage originalImage = grabber.grab(); Drawing stuff At times you will need to draw stuff onto the JavaCV image this can be done using simple functions void circle(image, Point(x,y),int rad, CV_BGR(b,g,r), int thickness=1) void ellipse(image, RotatedRect box, CV_BGR(b,g,r), int thickness=1) void line(image, Point(x,y), Point(x,y), CV_BGR(b,g,r), int thickness= 1) void rectangle(img, Point(x,y), Point(x,y), CV_BGR(b,g,r), int thickness) NOTE: negative thickness will fill in the rectangle or using other Java functions February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 17 Drawing functions: cvLine void cvLine(img, CvPoint pt1, CvPoint pt2, CvScalar color, int thickness=1, int lineType=8, int shift=0) Draws a line segment between pt1 and pt2 points in the image Parameters: img The image pt1 First point of the line segment pt2 Second point of the line segment color Line color thickness Line thickness lineType 8 - (or omitted) 8-connected line 4 - 4-connected line CV_AA - antialiased line shift Number of fractional bits in the point coordinates Example: cvLine(image, p0, p1, CvScalar.RED, 2, 8, 0); http://opencv.willowgarage.com/documentation/basic_structures.html#cvscalar Drawing functions: cvRectangle void cvRectangle(img, CvPoint pt1, CvPoint pt2, CvScalar color, int thickness=1, int lineType=8, int shift=0) Draws a rectangle with two opposite corners pt1 and pt2 Parameters: img Image pt1 One of the rectangles vertices pt2 Opposite rectangle vertex color Line color (RGB) or brightness (grayscale image) thickness Thickness of lines that make up the rectangle. Negative values, e.g., CV_FILLED, cause the function to draw a filled rectangle. lineType Type of the line, see Line description shift Number of fractional bits in the point coordinates Example: cvLine(image, p0, p1, CvScalar.RED, 3, CV_AA, 0); pt1 pt2 http://opencv.willowgarage.com/documentation/basic_structures.html#cvscalar February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 18 Image thresholding The simplest approach to segment an image is using thresholding If Img (irow,icol) > Thrshld then Img(irow,icol) = 255 else Img (irow,icol) = 0 Image thresholding: Example static IplImage hsvThreshold(IplImage orgImg) { // 8-bit, 3- color =(RGB) IplImage imgHSV = cvCreateImage(cvGetSize(orgImg), 8, 3); System.out.println(cvGetSize(orgImg)); cvCvtColor(orgImg, imgHSV, CV_BGR2HSV); // 8-bit 1- color = monochrome IplImage imgThreshold = cvCreateImage(cvGetSize(orgImg), 8, 1); // cvScalar : ( H , S , V, 0) // cvInRangeS(imgHsv, min_color,max_color, imgResult); //search for the color in image cvInRangeS(imgHSV, cvScalar(hueLowerR, 100, 100, 0), cvScalar(hueUpperR, 255, 255, 0), imgThreshold); cvReleaseImage(imgHSV); // return the processed image return imgThreshold; } http://opencv.willowgarage.com/documentation/basic_structures.html#cvscalar February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 19 Image smoothing/blurring Creating an approximation to capture important patterns in the data, while leaving out noise or other details pixel values are modified so that individual points (presumably because of noise) are reduced, and points that are lower than the adjacent points are increased leading to a smoother appearance Image smoothing Smoothing is used to reduce noise, sharpness of edges and detail in an image void cvSmooth(src, dst, int smoothtype=CV_BLUR, int param1) Parameters src The source image dst The destination image smoothtype type of the smoothing: CV_BLUR_NO_SCALE - linear convolution by box kernel (param1 x param1) with all 1's CV_BLUR - linear convolution by box kernel (param1 x param1) with all 1's and scaling of 1/(param1 x param1) CV_GAUSSIAN linear convolution with a Gaussian kernel CV_MEDIAN median filter with a \texttt{param1}\times\texttt{param1} square aperture CV_BILATERAL bilateral filter with a \texttt{param1}\times\texttt{param1} square aperture, param1 - parameter of the smoothing operation, the aperture width. Example: cvSmooth(src_image, dst_image, CV_BLUR, 7); February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 20 Image smoothing OpenCV version of the function http://opencv.willowgarage.com/documentation/c/image_filtering.html Using JavaCV for your CW Capture image Process image Higher level analysis Use result for decision making & interaction Start/ Create Save Open Move Copy/Paste Play ... etc. E.g.: Location & center of red object detected Provided via Code Examples Help in labs camera February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 21 Using JavaCV for your CW Capture image Process image Higher level analysis Use result for decision making & interaction Start/ Create Save Open Move Copy/Paste Play ... etc. E.g.: Location & center of red object detected Provided via Code Examples Help in labs WHAT YOU WILL BE DOING! camera Lets get started! LoadImg.java 1.Import the JavaCV related files 2.Try to load an image file 3.Smooth/blur the image 4.Save the image back to disk February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 22 Example 1: LoadImg.java LoadImg.java 1.Import the JavaCV related files 2.Try to load an image file example.jpg 3.Smooth the image You have already tested/worked on this at ITL! Example 2: CaptureImg.java Goal: Grab an image from camera 1.Import the relevant files 2.Define a grabber 3.Grab a frame (image) continuously 4.Save grabbed image to disk 5.Show grabbed image You have already tested/worked on this at ITL! February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 23 Example 2: CaptureImg.java What happens if you dont use if (img != null) cvWaitKey(5) What happens if you try to close the window? Hint: Make sure that your code checks if image is successfully grabbed & reacts to closing the window. Perhaps use a KeyListener? Example 3: ApplyImageOperations.java Goal: apply a number of operations on a loaded image Takes an image as input Clones it into a new image Returns the new image February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 24 Example 3: ApplyImageOperations.java 1. Prints the properties of the loaded image 2. Converts it to gray- scale 3. Clones the gray-scale image into a new image 4. Skews the gray image by a given angle Hint: Play with SkewGrayImage parameter(s) to see what effect it has on the result. Example 3: ApplyImageOperations.java February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 25 Example 4: ImagePanel.java Goal: integrate IplImage & Java image 1.Define & load an image JavaCV style 2.Convert iplImage to Java's BufferedImage Class 3.Start new JPanel with the BufferedImage 4.Draw an ellipse on the image and display it original image loaded from file painted image displayed on a panel frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE); How can you use this? ImagePanel.java When you need to have objects overlaid on top of the image (e.g. captured from the camera) to visualise the output of your programme to display both the player and the objects (that are appearing, falling, moving, changing, etc.) February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 26 Example 5: Ex2MyFirstGUIAppJava A simple GUI app using Java & JavaCV JavaCV can add to IplImage a method getBufferedImage to convert OpenCV data to Java's java.awt.imageBufferedImage that can be displayed using standard Java approach See the example in Ex2MyFirstGUIAppJava.java Code by Jarek Sacha How can you use this? Ex2MyFirstGUIAppJava Opening or capturing images while also creating the user interface Adding panel, buttons, file chooser etc. Open image, flip it upside down, swap red and blue channels etc. February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 27 Example 6: ObjectPositionDetect.java Goal: detect coloured (e.g. RED) regions/objects by using HSV colour space defining lower and upper thresholds thresholding the image Example 6: ObjectPositionDetect.java Goal: detect coloured (e.g. RED) regions/objects 1. Start the grabber 2. Threshold the original image using hsvThreshold this returns a binary image (black & white) 3. Use cvFindContours to find the contours in the binary image i.e., contours of the white areas 4. Draw a GREEN rectangle around each contour found Hint: Play with hueLowerR & hueUpperR parameters to see what effect they have on the result. February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 28 How can you use this? ObjectPositionDetect.java Using a red coloured pen/object/glove E.g. Navigation using a red-coloured object static gesture imitation using a red-coloured glove to play a game or enable painting based on the movement of the red object
Example 7: detectNplay.java Goal: To obtain dynamic sound output using dynamic visual input As long as frame is being captured from camera 1. Detect the red objects 2. Take the starting point (column value) of the 1 st detected object (its contour) 3. Pick a sound to be played: PianoA.aif 4. Change the pitch of the sound using the starting point (column value) of the detected red object PitchRatioCalculator.semitoneRatio(440, br.x()); 5. Do the above for the next detected red object February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 29 Example 7: detectNplay.java As long as frame is being captured from camera 1. Detect the red objects 2. Take the starting point (column value) of the 1 st detected object (its contour) 3. Pick a sound to be played: PianoA.aif 4. Change the pitch of the sound using the starting point (column value) of the detected red object PitchRatioCalculator.semitoneRatio(440, br.x()); 5. Do the above for the next detected red object Hint: Pick another sound, and use the row value, to see how the output would change. Alternative / Advance stuff February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 30 Example 8: MotionDetector.java 1. Start the grabber 2. Smooth the grabbed image 3. Convert the image to gray scale 4. If there is a previous image grabbed Take the difference between the current image and the previous image to detect change Threshold the resulting difference Hint: Play with cvSmooth parameters and cvThreshold parameters, to see what effect they have on the result. How can you use this? MotionDetector.java To detect where there is motion in the room (or of body, arms, hands) and how much for obtaining input purely based on motion E.g., for games played by motion of hands http://www.youtube.com/watch?v=Li_iCYl2ZQs http://www.youtube.com/watch?v=ddNvNJXwYxU February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 31 Example 8: MotionDetector.java Original code can be found -- javacv\samples Example 9: OpticalFlow.java Goal: detect key or good features (e.g. corners, edges of hands) and find where they move 1. Start the grabber 2. Take two consecutive frames & convert them to gray scale 3. Use cvGoodFeaturesToTrack to find the good features in the gray scale image 4. Use cvCalcOpticalFlowPyrLK to find the displacement of key features between the consecutive frames 5. Draw lines to show where the features moved February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 32 Example 9: OpticalFlow.java Hint: Play with MAX_CORNERS win_size parameters to see what effect they have on the result. How can you use this? OpticalFlow.java To detect dominant motion (e.g. hand up/down) in a specific region in a specific direction Use it for e.g., games played by motion of the hands http://www.youtube.com/watch?v=U4taMDEozCs February 2014 ECS522 / ECS744 - Graphical User Interfaces - 2013/14 33 Hints @ ITL check if cameras are connected The examples are provided for multiple purposes, pick the parts that you need for your coursework If the provided example codes do not work as desired check/modify lighting conditions too dark/too light? avoid cluttered background use simple dark background If you have doubts as to which code to use for what, ask us! Remember! Vision technology is not perfect Play with the available parameters, e.g.: Smoothing window size Lower and upper bounds for colour detection Vision technology is not perfect, but is fun Design your interface to accommodate for the imperfections as much as possible