# Getting Started with the Vector Dot Product: Math for Java Game Programmers

by Richard G. Baldwin

Learn the fundamentals of the vector dot product in both 2D and 3D. Discover how to update your game-math library to support various aspects of the vector dot product. And lastly, see how to write 2D and 3D programs that use the vector dot product methods in the game-math library.

Java Programming Notes # 1714

## Preface

### General

Next in a series

This tutorial is the next lesson in a series designed to teach you some of the mathematical skills that you will need (in addition to good programming skills) to become a successful game programmer. The first lesson was titled Math for Java Game Programmers, Getting Started. The previous lesson was titled Math for Java Game Programmers, Our First 3D Game Program (see Resources).

In addition to helping you with your math skills, I will also help you learn how to incorporate those skills into object-oriented programming using Java. If you are familiar with other object-oriented programming languages such as C#, you should have no difficulty porting this material from Java to those other programming languages.

Lots of graphics

Since most computer games make heavy use of either 2D or 3D graphics, you will need skills in the mathematical areas that are required for success in 2D and 3D graphics programming. As a minimum, this includes but is not limited to skills in:

• Geometry
• Trigonometry
• Vectors
• Matrices
• 2D and 3D transforms
• Transformations between coordinate systems
• Projections

Of course, game programming requires mathematical skills beyond those required for graphics. However, for starters, this series will concentrate on the last five items in the above list.

What you have learned

In the previous lesson, you learned how to write your first interactive 3D game using the game-math library. You also learned how to write a Java program that simulates flocking behavior such as that exhibited by birds and fish and how to incorporate that behavior into a game. Finally, you examined three other programs that illustrate various aspects of both 2D and 3D animation using the game-math library.

What you will learn

This lesson is the first part of a two-part mini-series on the vector dot product.  By the time you finish both parts, you will learn the fundamentals of the vector dot product in both 2D and 3D, you will learn how to update the game-math library to support various aspects of the vector dot product, and you will learn how to write 2D and 3D programs that use the vector dot product for various applications such as the back-face culling procedure that was used to convert the left image in Figure 1 to the right image in Figure 1.

Figure 1. Using the vector dot product for back-face culling.

### Viewing tip

I recommend that you open another copy of this document in a separate browser window and use the following links to easily find and view the figures and listings while you are reading about them.

#### Figures

• Figure 1. Using the vector dot product for back-face culling.
• Figure 2. Two vectors with their tails at the origin, program DotProd2D02.
• Figure 3. Dot product of two vectors with the same orientation in 2D.
• Figure 4. Dot product of two vectors with the same orientation in 3D.
• Figure 5. Dot product of a 3D vector with an identical vector.
• Figure 6. Dot product of vectors with opposite orientations.
• Figure 7. The dot product of perpendicular vectors in 2D.
• Figure 8. A general formulation of 2D vector perpendicularity.
• Figure 9. Another interesting 2D case of perpendicular vectors.
• Figure 10. A general formulation of 3D vector perpendicularity.
• Figure 11. A pair of perpendicular 3D vectors.
• Figure 12. Another pair of perpendicular 3D vectors.
• Figure 13. GUI for the program named DotProd2D01.
• Figure 14. A screen shot of the output from the program named DotProd3D01.
• Figure 15. Six (magenta) vectors that are perpendicular to a given (black) vector.

#### Listings

• Listing 1. Source code for the method named GM02.ColMatrix3D.dot.
• Listing 2. Source code for the method named GM02.Vector3D.dot.
• Listing 3. Source code for the method named GM02.Vector3D.angle.
• Listing 4. The actionPerformed method in the program named DotProd2D01.
• Listing 5. Format the dot product value for display in the GUI.
• Listing 6. Beginning of the actionPerformed method in the program named DotProd2D02.
• Listing 7. Compute the dot product and the angle between the two vectors.
• Listing 8. Source code for the game-math library named GM02.
• Listing 9. Source code for the program named DotProd2D01.
• Listing 10. Source code for the program named DotProd2D02.
• Listing 11. Source code for the program named DotProd3D01.
• Listing 12. Source code for the program named DotProd3D02.

### Supplementary material

I recommend that you also study the other lessons in my extensive collection of online Java tutorials. You will find a consolidated index at www.DickBaldwin.com.

## General background information

In this series, I will frequently refer you to an excellent interactive tutorial on Vector Math for 3D Computer Graphics by Dr. Bradley P. Kjell (see Resources) for the required technical background.  Then I will help you learn how to incorporate the knowledge that you gain from Kjell's tutorial into Java code with a heavy emphasis on object-oriented programming.

In the process, I will develop and explain a game-math library that you can use to experiment with and to confirm what you learn from the Kjell tutorial. The library will start out small and grow as we progress through more and more material in subsequent lessons.

For this lesson, I recommend that you concurrently study the Kjell tutorial through Chapter 10, Angle between 3D Vectors.

## Preview

I won't repeat everything that Dr. Kjell has to say. However, there are a few points that I will summarize in this section.

Basic definition of the vector dot product

The vector dot product is a special way to multiply two vectors to produce a real result. Fundamentally, the vector dot product of two vectors is the product of the lengths of the vectors multiplied by the cosine of the angle between them. By the angle between them, I mean the angle that would be formed if you were to draw the two vectors with their tails in the same location.

For example, Figure 2 shows a black vector and a magenta vector drawn with their tails at the origin. Eyeballing the picture suggests that the angle between the two vectors is forty or fifty degrees.

Figure 2. Two vectors with their tails at the origin, program DotProd2D02.

Can do more than eyeball

Fortunately, we can do more than eyeball the angle between two vectors. Figure 2 shows the screen output produced by the program named DotProd2D02 that I will explain in this lesson. DotProd2D02 is a 2D program. I will also explain a 3D version named DotProd3D02 in this lesson as well.

In Figure 2, the top four user input fields allow the user to enter the x and y coordinate values of two vectors according to the labels that identify those fields. When the user clicks the OK button, the first vector is drawn in black with its tail at the origin and the second vector is drawn in magenta with its tail at the origin. The dot product of the two vectors is computed and displayed in the bottom left text field, and the angle between the two vectors is computed and displayed in the bottom right text field.

Don't need to know the angle between the vectors

Upon seeing the definition of the dot product given above, you may reasonably be concerned about needing to know the angle between the vectors before you can compute the dot product. Fortunately, as you will see later, it is possible to compute the dot product of two vectors without knowing the angle. In fact, being able to compute the dot product is one way to determine the angle between two vectors.

As you can see, the value of the dot product of the two vectors shown in Figure 2 is 6000 and the angle between the vectors is 49.3987 degrees. You will learn how those values were computed shortly.

Major properties of the dot product

Here are some of the major properties of the dot product of two vectors:

1. The dot product of two vectors with the same orientation is the product of their lengths.
2. The length of a vector is the square root of the dot product of the vector with itself.
3. The dot product of two vectors having opposite orientations is the negative of the product of their lengths.
4. The dot product of perpendicular vectors is zero.
5. The angle between two vectors is the same as the angle between normalized versions of the vectors, which is equal to the arc cosine of the dot product of the normalized vectors.

As you will see later, these properties apply to both 2D and 3D vectors. In many cases, they also apply to vectors having more than three dimensions as well.

Dot product of two vectors with the same orientation in 2D

Figure 3 illustrates the first property in the above list: The dot product of two vectors with the same orientation is the product of their lengths.

Figure 3. Dot product of two vectors with the same orientation in 2D.

You may recall from some earlier experience that when a right triangle has sides with lengths of 30 and 40, the length of the hypotenuse is 50. That is the case for the magenta vector shown in Figure 3. Similarly, when the sides of the triangle are 60 and 80, the length of the hypotenuse is 100, as is the case for the black vector in Figure 3. From the property given above, we know that the dot product of the black and magenta vectors shown in Figure 3 is 5000, which agrees with the value shown in the Dot Prod output field in Figure 3.

Dot product of two vectors with the same orientation in 3D

Figure 4 shows the dot product of two vectors with the same orientation in 3D. The image in Figure 4 was produced by the program named DotProd3D02.

Figure 4. Dot product of two vectors with the same orientation in 3D.

Manually calculate the value of the dot product

You may need to get your calculator out to compute the lengths of the two vectors in Figure 4. Computing the lengths as the square root of the sum of the squares of the three components of each vector gives me the following lengths:

Rounding the product of the two lengths gives the dot product value of 10000, which matches the value shown in the bottom left output field in Figure 4.

The length of a vector

Figure 5 illustrates the second property in the above list: The length of a vector is the square root of the dot product of the vector with itself.

Figure 5. Dot product of a 3D vector with an identical vector.

Figure 5 displays two vectors having the same coordinate values as the black vector in Figure 4. (The black vector is hidden by the magenta vector in Figure 5.) Because these two vectors have identical coordinate values, the dot product of these two vectors is the same as the dot product of either vector with itself.

We concluded earlier that the length of each of these vectors is 141.42. This length is the square root of the dot product of the vector with itself. Squaring and rounding this length gives a dot product value of 20000, which matches the value shown in the bottom left output field in Figure 5.

Dot product of vectors with opposite orientations

Figure 6 illustrates the third property of the dot product given above: The dot product of two vectors having opposite orientations is the negative of the product of their lengths.

Figure 6. Dot product of vectors with opposite orientations.

The two vectors shown in Figure 6 have the same absolute coordinates as the two vectors shown in Figure 4. However, the algebraic signs of the coordinates of the magenta vector in Figure 6 were reversed relative to Figure 4, causing the magenta vector to point in the opposite direction from the black vector. (Note that the angle between the two vectors, as reported by the program is zero degrees in Figure 4 and is 180 degrees in Figure 6.)

The point here is that the dot product of the two vectors in Figure 6 is the negative of the dot product of the two vectors in Figure 4. This property will be used in another program in the second part of this two-part miniseries to achieve the back-face culling shown in Figure 1.

The computational simplicity of the vector dot product

If you have studied the Kjell tutorial through Chapter 10 (see Resources), you have learned that the dot product of two vectors can be computed as the sum of products of the corresponding x, y, and z components of the two vectors. In particular, in the 2D case, the dot product is given by:

2D dot product = x1*x2 + y1*y2

Similarly, in the 3D case, the dot product is given by:

3D dot product = x1*x2 + y1*y2 + z1*z2

Note that these two formulations don't require the program to know anything about the angle between the two vectors, as is the case in the earlier definition.

The dot product of perpendicular vectors in 2D

The dot product has many uses in game programming, not the least of which is determining if two vectors are perpendicular.

Figure 7 illustrates the fourth property in the above list: The dot product of perpendicular vectors is zero. This is an extremely important property in that it allows game programs to determine if two vectors are perpendicular. I will begin with a 2D discussion because the topic of perpendicularly of vectors is less complicated in 2D than in 3D.

Figure 7. The dot product of perpendicular vectors in 2D.

By eyeballing Figure 7, you can see that the magenta vector is probably perpendicular to the black vector. Looking at the output fields at the bottom left and the bottom right in Figure 7, you will see that the dot product of the two vectors is zero and the angle between the two vectors is 90 degrees.

Restating the perpendicularity (see Resources) property

Most of us learned in our plane geometry classes that the angle between perpendicular lines is 90 degrees. Therefore, the angle between perpendicular vectors must be 90 degrees. (See Resources for a definition of perpendicularity.)

Most of us also learned in our trigonometry classes that the cosine of 90 degrees is 0.0. Since, by definition, the value of the dot product of two vectors is the product of the lengths of the vectors multiplied by the cosine of the angle between them, and the angle must be 90 degrees for two vectors to be perpendicular, then the dot product of perpendicular vectors must be zero as stated by the fourth property in the above list of properties.

An infinite number of perpendicular vectors

By observing Figure 7, it shouldn't be too much of a stretch for you to recognize that there are an infinite number of different vectors that could replace the magenta vector in Figure 7 and be perpendicular to the black vector. However, since we are discussing the 2D case here, all of those vectors must lie in the same plane and must have the same orientation (or the reverse orientation) as the magenta vector. In other words, all of the vectors in the infinite set of vectors that are perpendicular to the black vector must lie on the line defined by the magenta vector, pointing in either the same direction or in the opposite direction. However, those vectors can be any length and still lie on that same line.

A general formulation of 2D vector perpendicularity

By performing some algebraic manipulations on the earlier 2D formulation of the dot product, we can formulate the equations shown in Figure 8 that define the infinite set of perpendicular vectors described above.

Figure 8. A general formulation of 2D vector perpendicularity.

 dot product = x1*x2 + y1*y2 If the two vectors are perpendicular: x1*x2 + y1*y2 = 0.0 x1*x2 = -y1*y2 x2 = -y1*y2/x1

As you can see from Figure 8, we can assume any values for y1, y2, and x1 and compute a value for x2 that will cause the two vectors to be perpendicular.

A very interesting case

One very interesting 2D case is the case shown in Figure 7. In this case, I initially specified one of the vectors to be given by the coordinate values (50,100).; Then I assumed that y2 is equal to x1 and computed the value for x2. The result is that the required value of x2 is the negative of the value of y1.

Thus, in the 2D case, we can easily define two vectors that are perpendicular by swapping the coordinate values between two vectors and negating one of the coordinate values in the second vector. The actual direction that the second vector points will depend on which value you negate in the second vector.

Another interesting 2D case of perpendicular vectors

Another interesting 2D case is shown in Figure 9.

Figure 9. Another interesting 2D case of perpendicular vectors.

In Figure 9, I assumed the same coordinate values for the black vector as in Figure 7. Then I assumed that the values of the y-coordinates for both vectors are the same. Using those values along with the equation in Figure 8, I manually computed a required value of -200 for the x-coordinate of the magenta vector. I entered that value into the field labeled VectorBx = in Figure 9 and clicked the OK button.

And the result was...

You can see that the value of the dot product of the two vectors in Figure 9 is 0.0, and the angle between the two vectors is 90 degrees. Therefore, although the magenta vector in Figure 9 is much longer than the magenta vector in Figure 7, the magenta vector in Figure 9 is still perpendicular to the black vector. Thus, Figure 7 and Figure 9 show two of the infinite number of magenta vectors that are perpendicular to the black vector in those figures.

The dot product of perpendicular vectors in 3D

As I mentioned earlier, the topic of perpendicularity in 3D is more complicated than is the case in 2D. As is the case in 2D, there are an infinite number of vectors that are perpendicular to a given vector in 3D. In 2D, the infinite set of perpendicular vectors must have different lengths taken in pairs, and the vectors in each pair must point in opposite directions.

An infinite number of perpendicular vectors having the same length

However, in 3D there are an infinite number of vectors having the same length that are perpendicular to a given vector. All of the perpendicular vectors having the same length must point in different directions and they must all lie in a plane that is perpendicular to the given vector. Perpendicular vectors having different lengths may point in the same or in different directions but they also must lay in a plane that is perpendicular to the given vector.

A wagon-wheel analogy

Kjell explains the situation of an infinite set of 3D vectors that are perpendicular to a given vector by describing an old-fashioned wagon wheel with spokes that emanate directly from the hub and extend to the rim of the wheel. The hub surrounds the axle and each of the spokes is perpendicular to the axle. (Note that the spokes on must bicycle wheels are not perpendicular to the axle so a bicycle-wheel analogy won't work here.) Depending on the thickness of the spokes, a large (but probably not infinite) number of spokes can be used in the construction of the wagon wheel.

Another wheel at the other end of the axle

In this case, the wagon wheel lays in a plane that is perpendicular to the axle. There is normally another wheel at the other end of the axle. Assuming that the axle is straight, the second wheel is in a different plane but that plane is also perpendicular to the axle. Thus, the spokes in the second wheel are also perpendicular to the axle. If there were two identical wheels at each end of the axle for a total of four wheels (the predecessor to the modern 18-wheeler tractor trailer), the spokes in all four of the wheels would be perpendicular to the axle. Again, the point is that there are an infinite number of vectors that are perpendicular to a given vector in 3D.

A general formulation of 3D vector perpendicularity

By performing some algebraic manipulations on the earlier 3D formulation of the dot product, we can develop the equations shown in Figure 10 that describe an infinite set of vectors that are perpendicular to a given vector.

Figure 10. A general formulation of 3D vector perpendicularity.

 dot product = x1*x2 + y1*y2 + z1*z2 If the two vectors are perpendicular: x1*x2 + y1*y2 + z1*z2 = 0.0 x1*x2 = -(y1*y2 + z1*z2) x2 = -(y1*y2 + z1*z2)/x1 or y2 = -(x1*x2 + z1*z2)/y1 or z2 = -(x1*x2 + z1*z2)/z1

(Although I didn't do so in Figure 10, I could have written three more equations that could be used to solve for x1, y1, and z1 if the given vector is notated as x2, y2, and z2.)

No simple case

Unlike with 2D vectors, (to my knowledge), there is no case that simply allows you to swap coordinate values and change the sign on one of them to produce a vector that is perpendicular to another vector. However, given the equations in Figure 10, and given values for x1, y1, and z1, we can assume values for y2 and z2 and determine the value for x2 that will cause the two vectors to be perpendicular.

While this is a fairly tedious computation with a hand calculator, it is very easy to write Java code to perform the computation. Therefore, given a 3D vector, it is fairly easy to write Java code that will compute an infinite number of vectors that are perpendicular to the given vector.

A pair of perpendicular 3D vectors

Figure 11 and Figure 12 each show a magenta 3D vector that is part of the infinite set of vectors that are all perpendicular to the black 3D vector. In Figure 11, y1 was assumed to be equal to y2, and z1 was assumed to be equal to z2. For an x1 value of 25, a value of -125 was required to cause the magenta vector to be perpendicular to the black vector.

Figure 11. A pair of perpendicular 3D vectors.

Another pair of perpendicular 3D vectors

In Figure 12, x1 was assumed to be equal to x2, and z1 was assumed to be equal to z2.

Figure 12. Another pair of perpendicular 3D vectors.

For a y1 value of 50, a y2 value of - 25 was required to cause the magenta vector to be perpendicular to the black vector.

The black vector didn't change

Note that the black vector is the same in Figure 11 and Figure 12. However, the magenta vectors are different in Figure 11 and Figure 12. They represent just two of the infinite set of vectors that are perpendicular to the black vector. (They are two of the vectors in the infinite set of perpendicular vectors that are relatively easy to compute using program code.)

Computing the angle between two vectors

The fifth property in the previous list reads: The angle between two vectors is the same as the angle between normalized versions of the vectors, which is equal to the arc cosine of the dot product of the normalized vectors.

In other words, given two vectors, we can compute the angle between the two vectors by first normalizing each vector and then computing the dot product of the two normalized vectors. (By normalization, I mean to change the coordinate values such that the direction of the vector remains the same but the length of the vector is converted to 1.0.) The dot product is equal to the cosine of the angle. The actual angle can be obtained by using one of the methods of the Math class to compute the arc cosine of the value of the dot product.

Used to compute the output angle in the programs

This is the procedure that is used by the programs in this lesson to compute and display the angle between two vectors as illustrated by the contents of the output field labeled Ang(deg) in Figure 12 and the output field labeled Angle (deg) = in Figure 9.

I will have more to say about this topic as I explain the code in the upgraded game-math library named GM02 as well as the following four programs that demonstrate the use of the upgraded game-math library:

• DotProd2D01
• DotProd2D02
• DotProd3D01
• DotProd3D02

## Discussion and sample code

 Testing All of the programs in this lesson were tested using JDK 1.6 running under Windows XP.

### The game-math library named GM02

In this section, I will present and explain an updated version of the game-math library named GM02.

This game-math library is an update to the game-math library named GM01. The main purpose of this update was to add vector dot product and related capabilities, such as the computation of the angle between two vectors to the library.

The following methods are new instance methods of the indicated static top-level classes belonging to the class named GM02.

• GM02.ColMatrix2D.dot - computes dot product of two ColMatrix2D objects.
• GM02.Vector2D.dot - computes dot product of two Vector2D objects.
• GM02.Vector2D.angle - computes angle between two Vector2D objects.
• GM02.ColMatrix3D.dot - computes dot product of two ColMatrix3D objects
• GM02.Vector3D.dot - computes dot product of two Vector3D objects.
• GM02.Vector3D.angle - computes angle between two Vector3D objects.

Will only explain the new 3D methods

I have explained much of the code in the game-math library in previous lessons, and I won't repeat those explanations here. Rather, I will explain only the new 3D code in this lesson. Once you understand the new 3D code, you should have no difficulty understanding the new 2D code.

You can view a complete listing of the updated game-math library in Listing 8 near the end of the lesson.

Source code for the method named GM02.ColMatrix3D.dot

Listing 1 shows the source code for the new instance method named GM02.ColMatrix3D.dot. If you have studied the Kjell tutorials (see Resources), you have learned that the dot product can be applied not only to two vectors, but can also be applied to the column matrix objects that are used to represent the vectors. Listing 1 computes the dot product of two ColMatrix3D objects and returns the result as type double.

Listing 1. Source code for the method named GM02.ColMatrix3D.dot.

 public double dot(GM02.ColMatrix3D matrix){ return getData(0) * matrix.getData(0) + getData(1) * matrix.getData(1) + getData(2) * matrix.getData(2); }//end dot

This is one of those cases where it is very easy to write the code once you understand the code that you need to write. Listing 3 implements the equation for the 3D dot product that I provided earlier and returns the result of the computation as type double.

Source code for the method named GM02.Vector3D.dot

Listing 2 shows the source code for the method named GM02.Vector3D.dot. This method computes the dot product of two Vector3D objects and returns the result as type double.

Listing 2. Source code for the method named GM02.Vector3D.dot.

 public double dot(GM02.Vector3D vec){ GM02.ColMatrix3D matrixA = getColMatrix(); GM02.ColMatrix3D matrixB = vec.getColMatrix(); return matrixA.dot(matrixB); }//end dot

Once again, the code is straightforward. All Vector3D objects instantiated from classes in the game-math library are represented by objects of the ColMatrix3D class. Listing 2 gets a reference to the two ColMatrix3D objects that represent the two vectors for which the dot product is needed. Then it calls the GM02.ColMatrix3D.dot method shown earlier in Listing 1 to get and return the value of the dot product of the two vectors.

Source code for the method named GM02.Vector3D.angle

Listing 3 shows the source code for the method named GM02.Vector3D.angle. This method computes and returns the angle between two Vector3D objects. The angle is returned in degrees as type double.

Listing 3. Source code for the method named GM02.Vector3D.angle.

 public double angle(GM02.Vector3D vec){ GM02.Vector3D normA = normalize(); GM02.Vector3D normB = vec.normalize(); double normDotProd = normA.dot(normB); return Math.toDegrees(Math.acos(normDotProd)); }//end angle

You need to understand trigonometry here

If you understand trigonometry, you will find the code in Listing 3 straightforward. If not, simply take my word for it that the method shown in Listing 3 behaves as described above.

The method begins by calling the normalize method on each of the two vectors for which the angle between the vectors is needed. (See an earlier lesson in Resources for an explanation of the normalize method.)

Then Listing 3 computes the dot product of the two normalized vectors. The value of the dot product is the cosine of the angle between the two original vectors.

After that, Listing 3 calls the acos method of the Math class to get the arc (inverse) cosine (see Resources) of the dot product value. The acos method returns the angle in radians.

Finally, Listing 3 calls the toDegrees method of the Math class to convert the angle from radians to degrees and to return the angle in degrees as type double.

That completes the discussion of the updates to the game-math library resulting in the new library named GM02.

### The program named DotProd2D01

To understand this program, you need to understand the material in the Kjell tutorial through Chapter 8 - Length, Orthogonality, and the Column Matrix Dot product.

The purpose of this program is simply to confirm proper operation of the GM02.ColMatrix2D.dot method. The program output is shown in Figure 13.

Figure 13. GUI for the program named DotProd2D01.

A graphical user interface

The program creates a GUI that allows the user to enter the first and second values for each of a pair of ColMatrix2D objects into four text fields. The GUI also provides a button labeled OK. When the user clicks the OK button, the dot product of the two ColMatrix2D objects is computed. The resulting value is formatted to four decimal digits and displayed in a text field in the lower left of the GUI.

Similar to previous programs

Much of the code in this program is similar to code that I have explained in earlier lessons, so I won't repeat those explanations here. I will explain only the code contained in the actionPerformed method that is new to this lesson. A complete listing of this program is shown in Listing 9.

The actionPerformed method in the program named DotProd2D01

The beginning of the actionPerformed method is shown in Listing 4. This method is called to respond to a click on the OK button shown in Figure 13.

Listing 4. The actionPerformed method in the program named DotProd2D01.

 public void actionPerformed(ActionEvent e){ //Create two ColMatrix2D objects. GM02.ColMatrix2D matrixA = new GM02.ColMatrix2D( Double.parseDouble(colMatA0.getText()), Double.parseDouble(colMatA1.getText())); GM02.ColMatrix2D matrixB = new GM02.ColMatrix2D( Double.parseDouble(colMatB0.getText()), Double.parseDouble(colMatB1.getText())); //Compute the dot product. double dotProd = matrixA.dot(matrixB);

Listing 4 begins by instantiating a pair of GM02.ColMatrix2D objects using data provided by the user in the top four fields shown in Figure 13.

Then Listing 4 calls the dot method on the object referred to by matrixA, passing the object referred to by matrixB as a parameter. The dot method computes the dot product of the two column matrix objects, returning the result as type double.

Format the dot product value for display in the GUI

In some cases, the format of the returned value is not very suitable for display in the lower-left field in Figure 13. For example, if the value is very small, it is returned in an exponential notation requiring a large number of digits for display. Similarly, sometimes the dot-product value is returned in a format something like 0.33333333 requiring a large number of digits to display.

Listing 5 formats the dot product value to make it suitable for display in the text field in Figure 13. (There may be an easier way to do this, but I didn't want to take the time to figure out what it is.)

Listing 5. Format the dot product value for display in the GUI.

 //Eliminate exponential notation in the display. if(Math.abs(dotProd) < 0.001){ dotProd = 0.0; }//end if //Convert to four decimal digits and display. dotProd =((int)(10000*dotProd))/10000.0; dotProduct.setText("" + dotProd); }//end actionPerformed

Eliminate exponential format and format to four decimal digits

Listing 5 begins by simply setting small values that are less than 0.001 to 0.0 to eliminate the exponential format for very small, non-zero values.

Then Listing 5 executes some code that formats the dot product value to four decimal digits. I will leave it as an exercise for the student to decipher how this code does what it does.

I recommend that you try it

I recommend that you plug a few values into the input fields, click the OK button, and use your calculator to convince yourself that the program properly implements the 2D dot product equation shown earlier.

That concludes the discussion of the program named DotProd2D01.

### The program named DotProd2D02

To understand this program, you need to understand the material in the Kjell tutorial through Chapter 9, The Angle Between Two Vectors.

This program allows the user to experiment with the dot product and the angle between a pair of GM02.Vector2D objects.

A screen shot of the output from this program is shown in Figure 2. The GUI shown in Figure 2 is provided to allow the user to enter four double values that define each of two GM02.Vector2D objects. The GUI also provides an OK button as well as two text fields used for display of computed results.

In addition, the GUI provides a 2D drawing area. When the user clicks the OK button, the program draws the two vectors, (one in black and the other in magenta), on the output screen with the tail of each vector located at the origin in 2D space. The program also displays the values of the dot product of the two vectors and the angle between the two vectors in degrees.

Once again, much of the code in this program is similar to code that I have explained before. I will explain only the method named actionPerformed, for which some of the code is new to this lesson. A complete listing of this program is provided in Listing 10.

Beginning of the actionPerformed method in the program named DotProd2D02

This method is called to respond to a click on the OK button in Figure 2.

Listing 6. Beginning of the actionPerformed method in the program named DotProd2D02.

 public void actionPerformed(ActionEvent e){ //Erase the off-screen image and draw the axes. setCoordinateFrame(g2D); //Create two ColMatrix2D objects based on the user // input values. GM02.ColMatrix2D matrixA = new GM02.ColMatrix2D( Double.parseDouble(vectorAx.getText()), Double.parseDouble(vectorAy.getText())); GM02.ColMatrix2D matrixB = new GM02.ColMatrix2D( Double.parseDouble(vectorBx.getText()), Double.parseDouble(vectorBy.getText())); //Use the ColMatrix2D objects to create two Vector2D // objects. GM02.Vector2D vecA = new GM02.Vector2D(matrixA); GM02.Vector2D vecB = new GM02.Vector2D(matrixB); //Draw the two vectors with their tails at the origin. g2D.setColor(Color.BLACK); vecA.draw( g2D,new GM02.Point2D(new GM02.ColMatrix2D(0,0))); g2D.setColor(Color.MAGENTA); vecB.draw( g2D,new GM02.Point2D(new GM02.ColMatrix2D(0,0)));

Listing 6 gets the four user input values that define the two vectors and draws them in black and magenta on the GUI shown in Figure 2. There is nothing new in the code in Listing 6.

Compute the dot product and the angle between the two vectors

Listing 7 computes the dot product and the angle between the two vectors by first calling the dot method and then the angle method on the object referred to by vecA, passing the object referred to by vecB as a parameter.

Listing 7. Compute the dot product and the angle between the two vectors.

 //Compute the dot product of the two vectors. double dotProd = vecA.dot(vecB); //Output formatting code was deleted for brevity //Compute the angle between the two vectors. double angle = vecA.angle(vecB); //Output formatting code was deleted for brevity myCanvas.repaint();//Copy off-screen image to canvas. }//end actionPerformed

In both cases, the code in Listing 7 formats the returned double values to make them appropriate for display in the bottom two text fields in Figure 2. This code was deleted from Listing 7 for brevity.

Confirm that the results are correct

Because this is a 2D display, it is easy to make an eyeball comparison between the drawing of the two vectors and the reported angle between the two vectors to confirm agreement. However, I recommend that you use this program to define several vectors and then use your scientific calculator to confirm that the results shown are correct.

That concludes the explanation of the program named DotProd2D02.

### The program named DotProd3D01

To understand this program, you need to understand the material in the Kjell tutorial through Chapter 8 - Length, Orthogonality, and the Column Matrix Dot product.

The purpose of this program is to confirm proper operation of the ColMatrix3D.dot method. The program creates a GUI that allows the user to enter three values for each of a pair of ColMatrix3D objects along with a button labeled OK. When the user clicks the OK button, the dot product of the two ColMatrix3D objects is computed and displayed.

A screen shot of the output from the program named DotProd3D01

A screen shot of the output from the program named DotProd3D01 is shown in Figure 14. (Compare Figure 14 with Figure 13.)

Figure 14. A screen shot of the output from the program named DotProd3D01.

Very similar to a previous program

Except for the fact that this program calls the dot method on an object of the GM02.ColMatrix3D class instead calling the dot method on an object of the GM02.ColMatrix2D class, this program is essentially the same at the program named DotProd2D01 that I explained earlier. Therefore, you should have no trouble understanding this program without further explanation from me. A complete listing of this program is provided in Listing 11.

That concludes the explanation of the program named DotProd3D01.

### The program named DotProd3D02

You need to understand the material in the Kjell tutorial through Chapter 10, Angle between 3D Vectors (see Resources) to understand this program.

Program output

A screen shot of the output of this program is shown in Figure 11. This program allows the user to experiment with the dot product and the angle between a pair of GM02.Vector3D objects. A GUI is provided that allows the user to enter six double values that define each of two GM02.Vector3D objects. The GUI also provides an OK button as well as two text fields used for display of the computed results.

In addition, the GUI provides a 3D drawing area. When the user clicks the OK button, the program draws the two vectors, (one in black and the other in magenta), on the output screen with the tail of each vector located at the origin in 3D space. The program also displays the values of the dot product of the two vectors and the angle between the two vectors in degrees. (Compare the output of this 3D program in Figure 11 with the output from the 2D program in Figure 2.)

Program code

A complete listing of this program is provided in Listing 12. Almost all of the new and interesting code in this program is in the method named actionPerformed.

Very similar to a previous program

If you compare the method named actionPerformed in Listing 12 with the actionPerformed method for the program named DotProd2D02 in Listing 10, you will see that they are very similar. One calls 2D methods in the game-math library while the other calls 3D methods in the same library. Therefore, you should have no difficulty understanding this program without further explanation from me.

That concludes the explanation of the program named DotProd3D02.

### Interpreting the vector dot product?

In effect, the dot product of two vectors provides a measure of the extent to which the two vectors have the same orientation. If the two vectors are parallel, the dot product of the two vectors has it maximum value of 1.0 multiplied by the product of the lengths of the two vectors. Normalizing the vectors before computing the dot product will eliminate the effect of the vector lengths and will cause the results to be somewhat easier to interpret.

If the normalized vectors are parallel and point in the same direction, the dot product of the normalized vectors will be 1.0. If the normalized vectors are parallel and point in opposite directions, the value of the dot product will be -1.0. If the vectors are perpendicular, the dot product of the two vectors will be 0.0 regardless of whether or not they are normalized.

For all orientations, the value of the dot product of normalized vectors will vary between -1.0 and +1.0.

### More than three dimensions

You may have it in your mind that the use of mathematical concepts such as the vector dot product is limited to the three dimensions of width, height, and depth. If so, that is a false impression. The vector dot product is very useful for systems with more than three dimensions. In fact, engineers and scientists deal with systems every day that have more than three dimensions. While it usually isn't too difficult to handle the math involved in such systems, we have a very hard time drawing pictures of systems with more than three or four dimensions.

Digital convolution is a good example

I have spent much of my career in digital signal processing where I have routinely dealt with systems having thirty or forty dimensions. For example, in the lesson titled Convolution and Frequency Filtering in Java and some other related lessons as well (see Resources), I describe the process of digital convolution filtering.

One way to think of digital convolution is that it is a running dot product computation between one vector (the convolution filter) and a series of other vectors, each comprised of successive chunks of samples from the incoming data. In non-adaptive systems, the vector that represents the convolution filter usually has a set of fixed coordinate values, and there may be dozens and even hundreds of such coordinates. (For an adaptive system, the values that define the vector typically change as a function of time or some other parameter.)

Often, the input data will consist of samples taken from a channel consisting of signal plus noise.  The objective is often to design a vector (the convolution filter) that is parallel to all of the signal components in the incoming data and is perpendicular to all of the noise components in the incoming data.  If that objective is achieved, the noise will be suppressed while the signal will be passed through to the output.

## Run the programs

I encourage you to copy the code from Listing 8 through Listing 12, compile the code, and execute the programs in conjunction with the game-math library named GM02. Experiment with the code, making changes, and observing the results of your changes. Make certain that you can explain why your changes behave as they do.

## Summary

In this lesson, you learned the fundamentals of the vector dot product in both 2D and 3D. You learned how to update the game-math library to support various aspects of the vector dot product, and you learned how to write 2D and 3D programs that use the vector dot product methods in the game-math library.

## What's next?

In the second part of this two-part miniseries, you will learn how to use the dot product to compute nine different angles of interest that a vector makes with various elements in 3D space.

You will learn how to use the dot product to find six of the infinite set of vectors that are perpendicular to a given vector as shown in Figure 15.

Figure 15. Six (magenta) vectors that are perpendicular to a given (black) vector.

You will also learn how to use the dot product to perform back-face culling as shown in Figure 1.

## Complete program listings

Complete listings of the programs discussed in this lesson are shown in Listing 8 through Listing 12 below.

Listing 8. Source code for the game-math library named GM02.

Listing 9. Source code for the program named DotProd2D01.

Listing 10. Source code for the program named DotProd2D02.

Listing 11. Source code for the program named DotProd3D01.

Listing 12. Source code for the program named DotProd3D02.

Copyright 2008, Richard G. Baldwin. Reproduction in whole or in part in any form or medium without express written permission from Richard Baldwin is prohibited.

Richard Baldwin is a college professor (at Austin Community College in Austin, TX) and private consultant whose primary focus is a combination of Java, C#, and XML. In addition to the many platform and/or language independent benefits of Java and C# applications, he believes that a combination of Java, C#, and XML will become the primary driving force in the delivery of structured information on the Web.

Richard has participated in numerous consulting projects and he frequently provides onsite training at the high-tech companies located in and around Austin, Texas. He is the author of Baldwin's Programming Tutorials, which have gained a worldwide following among experienced and aspiring programmers. He has also published articles in JavaPro magazine.

In addition to his programming expertise, Richard has many years of practical experience in Digital Signal Processing (DSP). His first job after he earned his Bachelor's degree was doing DSP in the Seismic Research Department of Texas Instruments. (TI is still a world leader in DSP.) In the following years, he applied his programming and DSP expertise to other interesting areas including sonar and underwater acoustics.

Richard holds an MSEE degree from Southern Methodist University and has many years of experience in the application of computer technology to real-world problems.

Baldwin@DickBaldwin.com