Navegação durante a visualização de imagens extragrandes em .NET

Categoria do blog: Imagens.NET

13.05.2020

Este artigo descreve como usar a classe ImageMapTool do VintaSoft Imaging .NET SDK para visualizar imagens grandes e extragrandes.

Vamos usar uma imagem JPEG2000 com tamanho de 4067 megapixels (35878x113378 pixels) como exemplo.
Aqui está a captura de tela de uma imagem JPEG2000 com zoom de 1% VintaSoft Imaging Demo:
Very large JPEG2000 image with 1% zoom in VintaSoft Imaging Demo

Aqui está a captura de tela de uma imagem JPEG2000 com zoom de 10% VintaSoft Imaging Demo:
Very large JPEG2000 image with 10% zoom in VintaSoft Imaging Demo

Ao visualizar uma imagem muito grande, muitas vezes é difícil entender em que parte da imagem você está no momento e para onde se mover para chegar ao local desejado. Geralmente, esse inconveniente pode ser resolvido reduzindo a escala da imagem e, em seguida, aumentando a escala da área desejada. Mas, no caso de a decodificação da imagem exigir muitos recursos, isso pode levar um tempo inaceitável. O uso do mapa de imagem usando a classe ImageMapTool é uma maneira confortável e elegante de resolver o problema.

Em VintaSoft Imaging Demo, o mapa de imagem pode ser ativado usando o item de menu "View -> Image Map Settings...". A captura de tela abaixo mostra as configurações do mapa de imagem na VintaSoft Imaging Demo:
Default image map settings in VintaSoft Imaging Demo


Na verdade, o mapa de imagens é um pequeno visualizador de imagens, localizado acima do visualizador principal, que exibe a mesma imagem, mas em outro modo de escala.A captura de tela abaixo mostra as configurações do mapa de imagem com um fator de escala de 1/25 em relação ao fator de zoom atual do visualizador de imagem principal:
Image map settings with custom scale factor in VintaSoft Imaging Demo


Classe ImageMapTool:

A propriedade ImageViewer.ViewerBufferSize permite especificar o tamanho, em megapixels, do retângulo da área totalmente em cache ao redor da área visível (retângulo amarelo) no visualizador de imagens. A captura de tela abaixo mostra as configurações do visualizador de imagens com uma área em cache de 6 megapixels ao redor da área visível no visualizador de imagens:
Image viewer settings with custom size of cached area around visible area in image viewer



Além disso, para imagens muito grandes, é possível usar vários elementos ImageMapTool no visualizador de imagens simultaneamente, cada um com uma escala relativa diferente. Isso é possível graças à classe CompositeVisualTool, que permite combinar a funcionalidade de várias ferramentas visuais.
Aqui está o código C# que mostra como criar 2 mapas de imagem no visualizador de imagens:
// create the first image map tool
Vintasoft.Imaging.UI.VisualTools.ImageMapTool imageMap1 = new Vintasoft.Imaging.UI.VisualTools.ImageMapTool();
// specify that image map must be enabled
imageMap1.Enabled = true;
// specify that image map tool must show image in best fit mode
imageMap1.Zoom = 0;
// specify that image map must have size 200x200 pixels
imageMap1.Size = new System.Drawing.Size(200, 200);
// specify that image map must be shown at the left-top corner of image viewer
imageMap1.Anchor = Vintasoft.Imaging.UI.AnchorType.Left | Vintasoft.Imaging.UI.AnchorType.Top;
// specify that image map tool border must have red color
imageMap1.CanvasPen = new System.Drawing.Pen(System.Drawing.Color.Red);
// specify that the border of image's visible region in image map must have lime color
imageMap1.VisibleRectPen = new System.Drawing.Pen(System.Drawing.Color.Lime);

// create the second image map tool
Vintasoft.Imaging.UI.VisualTools.ImageMapTool imageMap2 = new Vintasoft.Imaging.UI.VisualTools.ImageMapTool();
// specify that image map must be enabled
imageMap2.Enabled = true;
// specify that image map tool must show image in 1/25 scale from image viewer zoom
imageMap2.Zoom = 1 / 25f;
// specify that image map must have size 200x200 pixels
imageMap1.Size = new System.Drawing.Size(200, 200);
// specify that image map must be shown at the left-bottom corner of image viewer
imageMap2.Anchor = Vintasoft.Imaging.UI.AnchorType.Left | Vintasoft.Imaging.UI.AnchorType.Bottom;
// specify that image map tool border must have red color
imageMap2.CanvasPen = new System.Drawing.Pen(System.Drawing.Color.Red);
// specify that the border of image's visible region in image map must have lime color
imageMap2.VisibleRectPen = new System.Drawing.Pen(System.Drawing.Color.Lime);

// create composite visual tool that combines first and second image map tools
Vintasoft.Imaging.UI.VisualTools.CompositeVisualTool compositeVisualTool = new Vintasoft.Imaging.UI.VisualTools.CompositeVisualTool(imageMap1, imageMap2);

// set composite visual tool as current visual tool of image viewer
imageViewer1.VisualTool = compositeVisualTool;

A captura de tela abaixo mostra o visualizador de imagens com 2 mapas de imagem:
Image viewer with 2 image maps in VintaSoft Imaging Demo