CHI '95 ProceedingsTopIndexes
VideosTOC

The DragMag Image Magnifier

Colin Ware, Marlon Lewis


Colin Ware
Faculty of Computer Science
University of New Brunswick
P.O. Box 4400, Fredericton
New Brunswick, Canada E3B 5A3
Email: cware@UNB.ca


Marlon Lewis
SatLantic Inc.
Richmond Terminal, Pier 9
3295 Barrington Street
Halifax, NS. B3K 5X8

© ACM

Abstract

Computer image magnification often results in the loss of the contextual information. Two image magnification prototypes are presented that solve this problem. In both the base image is shown at all times with lines connecting the magnified region on the base image to the magnified image. Both prototypes allow for smooth pan, scroll, and zoom of large 2D images with both coarse and fine translation movements. The second design implements a magnifying glass metaphor whereby the degree of magnification is controlled by the distance of the enlarged image to the magnified region of the base image.

Keywords:

Data display, Pan, Scroll, Zoom.

Introduction

When panning and zooming through a large image the biggest problem is to avoid getting lost. At high magnifications all context is lost and it is usually necessary to zoom out, before zooming in to another point of interest. One of the best solutions to this problem is to maintain a plan view of the entire scene at all times, and to show magnifying windows. However there are various ways in which this might be implemented.

1) Fisheye view - In this case we enlarge one or more points of interest and compress the rest of the image proportionately with distance from the point of interest. This appears to work well for 2D information networks but seems poor for images and maps where the distortion is likely to result in a confusion [2].

2) Magnifying glass - problem is a loss of surrounding context (e.g [1]).

3) Separate magnified window with place holder in the base window to show the source. In the present paper we describe two solutions based on this option but with a number of additional features

The requirement of the prototypes described here was to allow an operator to rapidly interpret a large image of up to 12,500x12,500 using a computer interface. The particular target application was synthetic aperture radar imagery, but the problem is general to most high resolution images displayed on a screen. The two DragMag Image magnifier prototypes described in this paper were designed to solve the problem of continuous smooth zoom without loss of context and to allow for both coarse and fine translation movements. Two different designs were implemented as prototypes and evaluated.

DragMag Prototype 1

The first design is illustrated below and in the CHI- VIDEO review videotape. There basic elements are: a Base Image which consists of a view of the entire image filtered down so that it fits inside a window, the Mag Window , a region of the base image that is being magnified (highlighted with a color tinted patch,) and the Zoom Window, which is the magnified region. Lines connect the Zoom Window to its associated Mag Window to show the source of the information without ambiguity. Lines connect the corners of the Mag Window to the Zoom Window.

FIGURE 1 DragMag Prototype 1

Control of the position of the magnified region and the degree of magnification is by three methods

  1. o Dragging the Mag Window with the mouse to a new center of interest. This is the method for large scale adjustments.
  2. o Dragging "through" the Zoom window to move the surface. This is the method for small scale adjustments, since the magnified surface is being moved.
  3. o Moving the Zoom Slider controls the scale of the magnification.

All of the above adjustments result in real-time changes in the Magnified image and in the position and size of the Mag Window and connecting lines. In the prototype the Zoom Windows cannot be repositioned.

DragMag Prototype 2

The basic elements of DragMag 2 are the same as DragMag 1 as can be seen in this diagra

FIGURE 2 DragMag Prototype 2

Control of the position of the magnified region and the degree of magnification window is by three methods.

  1. o Dragging the Mag Window (same as for DragMag 1)
  2. o Dragging "through" the Zoom Window (same as for DragMag 1)
  3. o Moving the Zoom Window controls the degree of magnification and the size of the window. This is an adaptation of the magnifying glass metaphor whereby moving a magnifying glass towards you, (away from the subject), causes an increase in magnification. In this case moving the magnifying glass away laterally increases the degree of magnification. It is also possible to reposition a Zoom Window as desired to avoid obscuring objects of interest. A power function is used to control the scale, while the window size is linearly proportional to the distance.

To create a DragMag, the user positions the cursor on the base image at the region of interest. A DragMag instantly appears enlarging the selected center of interest. If desired another region can be selected and a second DragMag will appear. In the prototype implementation up to three separate DragMags are allowed.

Part of the idea behind this interface is that the base image should be as large as possible and should ideally cover the entire screen in order to permit the best possible overview.

EVALUATION OF THE PROTOTYPES

Both Drag Mag prototypes are successful in allowing the user to scan an image with large coarse movements (by moving the Mag Window) or with fine control (by dragging in the Zoom Window). This aspect of the interface is highly successful, it is natural and has a direct manipulation "feel". The idea of attaching the Mag Window to the Zoom Window works well in maintaining a visual cue as to the source of the information.

The two DragMag prototypes also have different individual strengths. The degree of magnification in Drag Mag 1 is controlled with a slider. This will normally require a mouse movement combined with an adjustment movement. While this is acceptable it was felt that some quicker method should be found for some applications. The fact that the windows were non-overlapping and in fixed locations was both an advantage and a disadvantage. It was an advantage in that it is simple, but the base window is necessarily small and the number of zoom windows must be fixed. However, the user is freed from the burden of window positioning.

Magnification in DragMag 2 is done by distance between the window to the point of interest. This works well but is judged to be somewhat less useful for systematically scanning the data for features that are invisible in the base image. However it is judged to be better for rapidly magnifying features that have already been identified in the base image. Thus it is probably better for medical applications, such as the examination of detailed X-ray images. The fact that the entire screen can be used for the base image is good but places a burden on the user who has to consider a good placement for windows.

We recommend that the basic design given in Prototype 1 be implemented but with some features from Prototype 2. It should be possible to have a base window the size of the entire screen so as to allow the best possible understanding of the entire image. The DragMag Zoom windows should be sizable and placable, but otherwise function as in Prototype 1. The Zoom Windows should not be allowed to overlap and should each be confined to one of the four screen quadrants to simplify placement. This will allow for between one and four DragMags to be placed at any one time.

It should be possible to mark and label interesting features in the Base window and in the Zoom Window. This will allow for the system to provide high quality illustrations to document things that have been identified.

References

  1. 1. Bier, E.A. Stone, M.C. Pier, K. Buxton, W., DeRose, T, (1993) Toolglasses and Magic Lenses: The See- Through Interface. ACM SIGGRAPH Proceedings. Anaheim, CA. pp 73-80.
  2. 2. Sarkar, M abd Brown, M. H. Graphical fisheye views of graphs, (1992) Proceedings of CHI'92. Monterey, CA. May 83-91.