Navigation while viewing large and extra large images.

Articles about functionality of VintaSoft Imaging .NET SDK.

Moderator: Alex

Post Reply
Site Admin
Posts: 1658
Joined: Thu Jul 10, 2008 2:21 pm

Navigation while viewing large and extra large images.

Post by Alex » Fri Feb 19, 2016 3:22 pm

This article describes how to use the ImageMapTool class ( ... pTool.html) for viewing large and extra large images.
JPEG2000 image with image size of 4067 megapixel (35878х113378 pixels) is taken as an example.


While viewing a very large image often it is difficult to understand above what part of image you are at the moment and where to move to get to the desired location:


Generally this inconvenience can be solved by scaling down the image and then scaling up the desired area. But in case when the decoding of image is rather resource-intensive it can take an unacceptable amount of time. So there is much more comfortable and elegant way to use the image thumbnail implemented in the ImageMapTool class ( ... pTool.html).

The Imaging Demo application ( provides the access to the tool via menu item "View->Image Map Settings...".


In fact the tool is a small ImageViewer, which is located above the main image viewer and shows the same image but in other scaling mode.


ImageMapTool class allows to:
  • navigate to the desired part of image by mouse click
  • view the whole image, or scale image relatively to the current scale of the main image
  • see the rectangle with visible area of image
  • see the rectangle with cached area of image
  • any instance of ImageMapTool class uses the same cache and renderer as the main ImageViewer, that guarantees the highest performance

Using the ImageViewer.ViewerBufferSize property ( ... rSize.html) it is possible to manage the size of rectangle of fully cached area around the visible area (yellow rectangle). This parameter is set in megapixels.

Besides that, for very very large images, is possible to arrange several ImageMapTool elements on ImageViewer at once, each with different relative scaling. This is possible owing to the CompositeVisualTool class ( ... lTool.html), which allows to combine the functionality of several visual tools:

Code: Select all

ImageMapTool imageMap1 = new ImageMapTool();
imageMap1.Enabled = true;
imageMap1.Zoom = 0; // best fit
imageMap1.Size = new Size(200, 200);
imageMap1.Anchor = AnchorType.Left | AnchorType.Top;
imageMap1.CanvasPen = new Pen(Color.Red);
imageMap1.VisibleRectPen = new Pen(Color.Lime);

ImageMapTool imageMap2 = new ImageMapTool();
imageMap2.Enabled = true;
imageMap2.Zoom = 1/25f; 
imageMap1.Size = new Size(200, 200);
imageMap2.Anchor = AnchorType.Left | AnchorType.Bottom;
imageMap2.CanvasPen = new Pen(Color.Red); 
imageMap2.VisibleRectPen = new Pen(Color.Lime);

imageViewer1.VisualTool = new CompositeVisualTool(imageMap1, imageMap2);

Post Reply