Raster Images , Raster Devices

AND
Pixmap Manipulation

Marc Levoy
Raster Image:
“Raster image is a matrix of numerical
values that represent pixels covering
the screen area”
Mathematically Raster is a rectangular grid
or array pixels positions.

Marc Levoy
Graphics Hardware
Raster Devices: Create pictures by displaying dots
– Eg: Video monitor, dot-matrix printer, laser printer, ink-jet
printer, film recorder
– Advantages: Filled, shaded regions are easily displayed
– Disadvantages: Jaggies

Pixel

Marc Levoy
Continue…..

Bitmap Image
Vector Graphics

Marc Levoy
Raster Display

•Most display used for computer graphics nowadays are

raster displays.
•Image presented in display surface that contains certain
number of pixels. Eg. 480 x 640 (r x c).
•Frame buffer is a region of memory sufficiently large to
hold all the pixel values for display.
Marc Levoy
Frame Buffer

Rasterization / Scan Conversion:

Rasterization is the process of converting primitive
ingredients of picture from its geometric and Mathematical
definiton into a set of pixels

Marc Levoy
RGB Color Definition (OpenGL)

Set a particular color: glColor3f(r,g,b);

Set a background color: glClearColor(r,g,b,1);

Clear the window to background color:

glClear(GL_COLOR_BUFFER_BIT);

Marc Levoy
Pixel Depth
Pixel depth refers to the number of bits used to
represent a pixel value.
1 bit/pixel: 0 2 Levels
(Bi-level image)
1

2 bits/pixel: 0 0
4 Levels
0 1

1 0

1 1 Marc Levoy
Continue…..
– 1 bit per pixel produce 2 levels (bi-level
image).
– 2 bits per pixel produce 4 levels.
– 8 bits per pixel produce 256 levels.

In general, if the pixel depth is n, then it is

possible to have 2n levels.

Marc Levoy
Pixmaps and Bitmaps
A raster image is stored in a computer as a
rectangular array of numerical values.
The array has a certain number of rows and a certain
number of columns.
Each numerical value represents the value of the
pixel stored there.
The array as a whole is often called a pixel map or
bitmap.

Marc Levoy
Manipulating Pixmaps

Pixmaps may be stored in regular memory or in the

frame buffer (off-screen or on-screen).
Rendering operations that draw into the frame buffer
change the particular pixmap that is visible on the
display.

Marc Levoy
RGBApixmap Class
The RGBpixmap class stores the number of rows
and columns in the pixmap, as well as the address
of the first pixel in memory.

Marc Levoy
Continue…..
class mRGBA
class RGBApixmap { // the name RGBA is already used by Windows
{ public :
private: unsigned char r, g, b, a;
mRGBA *pixel; // array of pixels mRGBA()
  {
public: r=g=b=0; a=255; //Three different versions of
// dimensions of pixel map constructors
int nRows; //height }
int nCols; //width
mRGBA(mRGBA &p)
{
RGBApixmap() r=p.r; g=p.g; b=p.b; a=p.a;
{ }
nRows = nCols = 0; pixel = 0;
} mRGBA(unsigned char rr, unsigned char gg,
unsigned char bb, unsigned char aa)
{
RGBApixmap(int rows, int cols) r=rr; g=gg; b=bb; a=aa;
{ }
nRows = rows;
nCols = cols; void set(unsigned char rr, unsigned char gg, unsigned char bb,
pixel = new mRGBA[rows * cols]; unsigned char aa)
} {
r=rr; g=gg; b=bb; a=aa;
}

};
Marc Levoy
Class RGBApixmap……….
void freeIt()
{
delete []pixel;
nRows = nCols = 0;
}

// *** draw this pixel map at current position

 
void mDraw()
{
if (nRows == 0 || nCols == 0)
return;
 
// tell OpenGL: don't align pixels with 4-byte boundaries in memory

glPixelStorei(GL_UNPACK_ALIGNMENT,1);
glDrawPixels(nCols, nRows, GL_RGBA, GL_UNSIGNED_BYTE, pixel );
 
}
 

Marc Levoy
glPixelStorei() — set pixel storage modes
glDrawPixels() draws a given pixmap into the frame
buffer. We can also copy a pixmap from memory
to memory.
Parameters
Width :The width dimension of the pixel rectangle that will be written
into the framebuffer.
height The height dimension of the pixel rectangle that will be written
into the framebuffer.
format The format of the pixel data. Acceptable symbolic constants are as
follows.

Marc Levoy
Pixmap Operations: Copying

type The data type for pixels. The following are the accepted symbolic
constants and their meanings

Value Meaning
GL_UNSIGNED_BYTE Unsigned 8-bit integer
GL_BYTE Signed 8-bit integer
GL_BITMAP Single bits in unsigned 8-bit integers
GL_UNSIGNED_SHORT Unsigned 16-bit integer
GL_SHORT Signed 16-bit integer
GL_UNSIGNED_INT Unsigned 32-bit integer
GL_INT 32-bit integer
GL_FLOAT Single-precision floating-point
pixels A pointer to the pixel data.
Marc Levoy
 // *** read a rectangule of pixels into this pixmap
  int mRead(int x, int y, int wid, int ht)
{
nRows = ht;
nCols = wid;
pixel = new mRGBA[nRows*nCols];
if ( !pixel )
return -1;
// tell OpenGL: don't align pixels with 4-byte boundaries in memory
glPixelStorei(GL_UNPACK_ALIGNMENT,1);
glReadPixels(x, y, nCols, nRows, GL_RGBA, GL_UNSIGNED_BYTE, pixel);
return 0;
}

Marc Levoy
glReadPixels () reads a portion of the frame buffer into memory.
Parameters
x The window x coordinate of the first pixel that is read from the framebuffer.
Together with the y coordinate, specifies the location of the lower-left corner
of a rectangular block of pixels.
y The window y coordinates of the first pixel that is read from the framebuffer.
Together with the x coordinate, specifies the location of the lower-left corner
of a rectangular block of pixels.
width The width of the pixel rectangle.
height The height of the pixel rectangle. Width and height parameters of value "1"
correspond to a single pixel.
format The format of the pixel data.
pixels Returns the pixel data.

Marc Levoy
 void setPixel(int x, int y, mRGBA color) {
 
if ( x>=0 && x<nCols && y>=0 && y<nRows)
 
pixel[nCols*y + x] = color;
}

Marc Levoy
readBMPFile()
readBMPFile() reads an image stored as a (24-bit) BMP file into the pixmap,
allocating storage as necessary.

Possible red shades -----------------28

Possible Green shades -----------------28
Possible Blue shades -----------------28

Total possible shades -----------------224

Our example OpenGL application has use six bitmaps. To create them we
first make an RGBpixmap object for each:

RGBpixmap pix[6]; // create six (empty) pixmaps

Marc Levoy
readBMPFile() provides a simple way to read a BMP
image into a pixmap. For instance,
pix[1].readBMPFile(“abc.bmp");
reads the file abc.bmp and creates the pixmap in
pix[1].

Marc Levoy
int RGBApixmap::readBMPFile(string fname)
{
FILE *fp;
// long index;
int row, col, numPadBytes, nBytesInRow;
unsigned long fileSize;
unsigned short reserved1;
unsigned short reserved2;
unsigned long offBits;
unsigned long headerSize;
unsigned long numCols;
unsigned long numRows;
unsigned short planes;
unsigned short bitsPerPixel;
unsigned long compression;
unsigned long imageSize;
unsigned long xPels;
unsigned long yPels;
unsigned long numLUTentries;
unsigned long impColors;
long count = 0;
// read BMP file into this pixmap
// always 0
// always 0
// offset to image - unreliable
// always 40
// number of columns in image
// number of rows in image
// always 1
// 8 or 24; allow 24 here
// must be 0 for uncompressed
// total bytes in image
// always 0
// always 0
// 256 for 8 bit, otherwise 0
// always 0
Marc Levoy
/* open the file */
if( ( fp = fopen( fname.c_str(), "rb" ) ) == NULL )
{
printf( "Error opening file %s.\n", fname );
exit( 1 );
}
/* check to see if it is a valid bitmap file */
if( fgetc( fp ) != 'B' || fgetc( fp ) != 'M' )
{
fclose( fp );
printf( "%s is not a bitmap file.\n", fname );
exit( 1 );
}
fileSize = getLong( fp );
reserved1 = getShort( fp ); // always 0
reserved2 = getShort( fp ); // always 0
offBits = getLong( fp ); // offset to image – unreliable
headerSize = getLong( fp ); // always 40
Marc Levoy
 numCols = getLong( fp ); // number of columns in image
numRows = getLong( fp ); // number of rows in image
planes = getShort( fp ); // always 1
bitsPerPixel = getShort( fp ); //8 or 24; allow 24 here
compression = getLong( fp ); // must be 0 for uncompressed
imageSize = getLong( fp ); // total bytes in image
xPels = getLong( fp ); // always 0
yPels = getLong( fp ); // always 0
numLUTentries = getLong( fp ); // 256 for 8 bit, otherwise 0
impColors = getLong( fp ); // always 0
if( bitsPerPixel != 24 )
{
// error - must be a 24 bit uncompressed image
printf( "Error bitsperpixel not 24\n" );
exit( 1 );
}
// add bytes at end of each row so total # is a multiple of 4
// round up 3 * numCols to next mult. of 4
Marc Levoy
 nBytesInRow = ( ( 3 * numCols + 3 ) / 4 ) * 4;
numPadBytes = nBytesInRow - 3 * numCols; // need this many
this->nRows = numRows; // set class's data members
this->nCols = numCols;
this->pixel = new mRGBA [ nRows * nCols ]; // make space for array

if( !this->pixel ) return 0; // out of memory!

count = 0;
//dum;
for( row = 0; row < numRows; row++ ) // read pixel values
{
for( col = 0; col < numCols; col++ )
{
int r, g, b;
b = fgetc( fp );
g = fgetc( fp );
r = fgetc( fp ); // read bytes

Marc Levoy
 pixel[count].r = r; // place them in colors
pixel[count].g = g;
pixel[count].b = b;
/*if( pixel[count].r != 255)
{cout<< pixel[count].r << pixel[count].g <<
pixel[count].b;
cout << endl; }*/
pixel[count++].a = 255;

fskip( fp, numPadBytes );

}
fclose( fp );
return 1;

} // end of readBMPFile

Marc Levoy
RGBApixmap::setChromaKey
void RGBApixmap::setChromaKey(int r, int g, int b)
{
long count = 0;
for(int row = 0; row <this->nCols ; row++)
for(int col = 0; col < this->nRows; col++)
{
mRGBA p = pixel[count];

if(p.r == r && p.g == g && p.b == b)

pixel[ count++ ].a = 0;
else
pixel[ count++ ].a = 255;

}
}

Marc Levoy
glCopyPixels()

glCopyPixels() copies a region in one part of the

frame buffer into another region of the frame
buffer.

Marc Levoy
 mRGBA getPixel(int x, int y)
{
 
mRGBA bad(255, 255, 255, 255);
 
assert(x>=0 && x<nCols);
 
assert(y>=0 && y<nRows);
 
return pixel[nCols*y+x];
 
}

Marc Levoy
Scaling Pixmaps
glPixelZoom(float sx, float sy);
– Sets scale factors in x and y
– Any floating point values are allowed for sx and sy, even negative
ones. The default values are 1.0.
– The scaling takes place about the current raster position, pt.

Scale factors are applied to the image drawn from a pixmap, not to the pixmap.
Roughly, the pixel in row r and column c of the pixmap will be drawn as a rectangle of
width sx and height sy screen pixels, with lower left corner at screen pixel (pt.x + sx * r,
pt.y + sy * c).

Marc Levoy
Example
Six scaled versions of the mandrill (scale factors sx = -1.5,
-1.0, -0.5, 1.5, 1.0, 0.5.)
To produce each image the new value of sx was set, and
glPixelZoom(sx, 1); glutPostRedisplay(); was executed.

Marc Levoy
Pixmap Data Types
RGB pixmap contains 3 bytes, one each for red, green,
and blue
RGBA pixmap contains 4 bytes, one each for red, green,
blue, and alpha (transparency)
Code: start by defining a color:
struct RGB { public: unsigned char r, g, b; };
// Holds one color triple

Marc Levoy
Default RGBpixmap constructor: make empty
pixmap.
Constructor creates a pixmap with r rows and c
columns.
setPixel() sets a specific pixel value.
getPixel() reads a specific pixel value.
draw() copies pixmap to frame buffer, placing lower
left corner at current raster position.
set current raster position using glRasterPos2i (x, y);

Marc Levoy
read() copies from frame buffer to memory
– Lower left corner is at (x,y), and wid and ht specify the size to be
read.

copy() does a read followed by a draw, without

creating an intermediate pixmap
– The region with lower left corner at (x,y), wid by ht in size, is
copied to the region whose lower left corner is at the current raster
position.

Marc Levoy
writeBMPFile() creates a (24-bit) BMP file that contains the
pixmap.
Code for both of these functions is given online at the
book’s companion website.

Marc Levoy