I want to create a bar-bell out of three boxes. This will take three boxes stacked on top of each other.

computer science


Making a Bar Bell

I want to create a bar-bell out of three boxes.  This will take three boxes stacked on top of each other.  The ends will be boxes that are 2" by 1" by 2".  The bar between the ends will be a box that is 1/2" by 4" by 1/2".  I would like to have the center of the bar-bell on the origin with the Y axis through its center.  

If you examine the colorCube code, you'll find that it places the back-left-bottom corner of the box at the origin.  For a bar-bell end, we need the center of the bottom of the box on the origin.  If the box is 2" square, we need to translate the box back 1" in the X and Z dimensions.  


Create a function called BarBell() and put the following code into it.

function barBell()


//create a global variable to hold transformation matrix;

    matrix=translate(-0.25,-2,-0.25, 0); 

    colorCube(0.5, 4, 0.5);   //add the shaft

    matrix=translate(-1, -3, -1);

    colorCube(2,1,2);   //bottom 

    matrix=translate(-1, 2, -1);

    colorCube(2, 1, 2);     //top 


We need to apply the transformation to all the vertices of the colorCube.  To do that, we need to create a function to multiply a matrix and a vector as follows:

function multiply( u, v )


    var result = [];

    for ( var i = 0; i < u.length; ++i ) {

            var sum = 0.0;

            for ( var k = 0; k < u.length; ++k ) {

                    sum += u[i][k] * v[k];


            result.push( sum );                 


    return result;  


Modify the following statement in the quad function:

change points.push(vertices[indices[i]);  to

points.push(multiply(matrix,vertices[indices[i]]) );

Run this and you should see the bar-bell in the center of the origin.  

Instruction Files

Related Questions in computer science category