Manipulating Images

In the process of preparing an image for the Web it is frequently necessary to manipulate it in some way, for example to change its size, color palette, or other attributes. The tools listed here are for use on Unix systems; there are analogous tools for other platforms.

Displaying an Image
Getting Information About an Image
Converting Between Formats
Cropping
Scaling
Interlacing
Transparency
Painting / Touching Up

Displaying an Image

One of most common things you need to do with an image is to display it on the screen so you can look at it. The ImageMagick program display will display an image in just about any format imaginable on a Unix workstation; just type

display IMAGEFILE

and the image will appear in a window. Another way to view some images is to load them into your Web browser, but this obviously only works for images in a format that your browser can display (GIF, or in some cases JPEG).

Getting Information About an Image

Frequently you have an image file and you need to find out something about the image stored in it, such as its size. While viewing an image with ImageMagick's display program you can find out information about the image by selecting the Image Info option from the menu that appears when you press the right mouse button with the cursor over the image.

You can also use the ImageMagick identify program to find out certain details about an image from the command line, as in:

  % identify sample.gif
  sample.gif 303x192 PseudoClass 256c 46026b GIF 1s

Converting Between Formats

One of the most common things that you need to do with an image to prepare it for the Web is to convert it to a different format, in particular to GIF or TIFF. The ImageMagick program convert does this. It can handle a huge variety of formats. It takes two arguments --- the input file first, and the output file second. It deduces the format to convert to by looking at the extension (everything after the ".") in the second filename. So for example, to convert a PICT file to GIF:

convert image.pict image.gif

Convert takes lots of options to specify how the conversion is to be done, and it can do a lot of things in addition to just converting between file formats. Some of these other operations are described below; see its man page for all the details.

Cropping

Cropping refers to the process of extracting a rectangular piece of an image to create anther, smaller image. This does not include scaling; the resulting image is exactly the same as the specified rectangle in the original image --- it just omits everything else from that image.

Interactive Cropping
The ImageMagick program display allows you to interactively select a region of an image for cropping. To use this feature, run display on your image, and select the Crop option from the right-mouse menu, and then use the left mouse button to define your cropping rectangle. When you are happy with the rectangle, hit the Crop button in the Commands window. You can then save the resulting cropped image via the File->Save menu in the Commands window.
Batch Cropping
If you know the exact pixel coordinates of the region you want to crop, you can use the -crop option to the ImageMagick convert program. For example, to extract a 200 X 100 rectangle whose upper left corner is at pixel coordinate (300,400) from an image called image.gif, use the command:
```
convert -crop 200x100+300+400 image.gif newimage.gif
```

Scaling

Scaling refers to the process of stretching an image either horizontally, or vertically, or both. ImageMagick's convert program does scaling easily with its -geometry option. For example, to scale an image to be exactly 640 X 480 pixels, give the command

convert -geometry 640x480! image.gif image.gif

Note that this command overwrites the file image.gif with the scaled image; if you want to save the scaled image in a new file rather than overwriting the original one, specify a new name for the second file on the command line.

The ! after the size specification in the command above tells convert to force the resulting image to be exactly 640 X 480. Without the !, convert will scale the image as much as possible to fit within the given size without altering its aspect ratio, so the result may not be exactly 640 X 480.

There are other ways to specify scaling factors and sizes in the convert program; see its man page for details.

Interlacing

Interlacing refers to an aspect of the way data is stored in an image file. Interlaced images have their rows stored in some order that is more or less uniformly distributed throughout the image, rather than sequentially. Web browsers make use of this by displaying a crude representation of the image which gets finer over time as the image finishes loading. This is sometimes convenient because it allows the user to see a general impression of the whole image without having to wait for all of it to load. ImageMagick's convert program will interlace an image when given the -interlacing PLANE option. For example,

convert -interlacing PLANE image.gif image.gif

will replace the file image.gif with an interlaced image. (The word PLANE specifies the kind of interlacing to do; convert can do two different kinds, but for GIF images for use on the Web it doesn't matter which one you do.)

Transparency

Often it is desirable for an image on a Web page to have a transparent background, so that it will blend well with the background color of the Web browser. To give an existing image a transparent background, you must pick a color that appears in the image, and then run the image through a program which modifies it to make the pixels containing that color transparent.

As usual, ImageMagick's convert program can add transparency to images:

convert -transparency white image.gif image.gif

will change all white pixels in image.gif to be transparent. You can also specify the color to be made transparent using hexadecimal RGB values, for example -transparency #faf7ef will make all pixels containing color #faf7ef transparent. See the COLOR NAMES section of the X man page for details on how to specify RGB colors in this way.

You can use ImageMagick's display program to find out the RGB color value of a particular pixel in an image; just press the middle mouse button with the cursor over the desired pixel.

Painting / Touching Up

Sometimes you need to be able to operate on an image pixel by pixel by hand. Sometimes this is because of some bug or undesirable feature in a program that you used to produce the image, and rather than fix the program, its more expedient to just fix the image. Other times you need to be able to actually create part or all of the image by paiting it by hand. Whatever the reason, a painting program can be a valuable tool to have.

The ImageMagick program display lets you do a limited amount of image touchup and painting; use the Image Edit menu on the Commands window. (Click the left mouse button in the image to make the Commands window appear if it is not already visible).

Next: Installing Images
Up: Still Images
Prev: Creating Images

The Geometry Center Home Page

Comments to: webmaster@geom.umn.edu
Created: May 31 1996 --- Last modified: Tue Jun 4 15:27:39 1996