Image View: Web Deep Zoom Toolkit

The Web Deep Zoom Toolkit (WDZT) is designed to visualize big images across multiple frames and layers.
Web Deep Zoom Toolkit screenshot
Web Deep Zoom Toolkit screenshot


The toolbar contains the following buttons:
  • Toggle modules menu icon Show or hide all menus of interactive control modules.
  • Zoom in icon Zoom in.
  • Zoom out icon Zoom out.
  • Home icon Go back to the original image view where the entire image is visible.
  • Enter fullscreen icon Switch to full screen mode.
  • Exit fullscreen icon Exit full screen mode.
  • Skip backward icon Go to the first frame.
  • Seek backward icon Go to previous frame.
  • Play icon Enter the movie mode. In the movie mode, each next frame is displayed after 2.5 seconds.
  • Pause icon Pause the movie mode.
  • Seek forward icon Go to next frame.
  • Skip forward icon Go to the last frame.
In addition, one can advance the frames by using either the slider bar or the edit box for entering a desired frame index followed by pressing the Enter key.

Interactive Control Modules

Modules are automatically added or removed depending on the type of an information layer being displayed.

Layer selection

The layer selection module allows one to change the displayed information layer.
The frame number, zoom and position are preserved when changing layers of similar types.
Layer selection module screenshot Layer selection module screenshot
Layer selection module: phase contrast and masks

Layer composition

The layer composition is designed to display multiple layers on top of each others.
The layer selected in this Layer composition module is displayed on top of the one selected in the Layer selection module.
The opacity of the added top layer is adjustable with the slider ranging from transparent (left - not visible) to opaque (right - fully visible).
If multiple layers are added, one can set the stack order by dragging and dropping the arrows or text of the composition labels.
Layer composition module screenshot
Layer composition module: a segmentation mask on top of a phase contrast layer allows to inspect segmentation results.

Display info

Display info module screenshot
Display information module.
The display information module has two sections:
Cursor information
Display information about the current cursor position. The information is updated every time the cursor stops hovering over the image panel.
Image coords
Position of a cursor in the coordinate system of the entire image.
Screen coords
Position of a cursor in the coordinate system defined by the image displayed currently.
Intensity of the pixel defined by the cursor position.
Acquired intensity
Approximative intensity of the pixel under the cursor as it was acquired before conversion to 8bpp.
Not available on all datasets.
Field of view info
Display information about the current field of view. The information is updated every time the field of view changes.
Current zoom. 100% means original image resolution, 50% means half the original image resolution, etc... This percentage is similar to the one used by image processing programs such as ImageJ.
X, Y, width and height
Position of the current field of view in the entire image. X and Y represent the upper left corner of the field of view.

Colony searching

Enter a colony number and press Enter to highlight its bounding box in the image.
Colony searching module screenshot
Colony searching module.

Screen recording

There are two buttons when opening the module:
  • Take snapshot icon Take a snapshot of the current screen and download it as a zip file along with the provenance informations (see below).
  • Start recording icon Activate the recording mode. This mode is designed for recording an image every time a frame or an information layer has changed. This could be achieved by pressing the play button of the toolbar and interactively browsing the image while recording frames.
    The recording operation is performed in RAM on the client side, and the recorded images with the provenance file are compressed into a zip file. A user can download the zip file by clicking on the folder icon (Download zip icon) that appears after the stop recording button (Stop recording icon) is clicked. During the recording, the system checks the cumulative file size and pops up a warning dialog when the size exceeds a few MB.

Both snapshot and recording modes gather information about the image layer, its frame index and zoom level, and the viewed window in pixels for each recorded image. This information is stored in a provenance file together with the name of the recorded image file.

The Options section supports publications of images with interesting content. It allows a user to include a scale bar and a timestamp in the downloaded images as watermarks.

The recording mode might consume a lot of RAM memory over a longer period of recording time. This could lead to a browser crash if too many frames are recorded. If this is the case then please consider using the data fetching module.

Screen recording module screenshot
Screen recording module.
Screen recording module result
Screen recording module result example.

Data fetching

Data fetching module screenshot
Data fetching module.

This module is designed to sample images by specifying the field of view and the zoom. By default, the currently displayed field of view is fetched. One can customize the field of view by checking "Manually set bounds". This enables a user to enter the desired zoom and field of view into the editable fields under the "Fetching bounds" panel.
The "layers to fetch" panel allows to select which layers to download. Multiple layers can be selected and they will be downloaded in separate zip files .
The "Frame range" field is for specifying which frames to sample. For example, entering 1-5,14-16,20 into the "Frame range" edit box will lead to downloading frames 1, 2, 3, 4, 5, 14, 16 and 20.
The sampling and downloading are triggered by clicking the "Fetch" button. It performs image sampling computations on the server side using java code. The computations include image extraction, compression of images into a zip file, and creation of the corresponding provenance information inserted into the zip file. The download will start automatically when the sampling computations are finished on the server.

When using the data fetching module, the images are provided in their original format (if available), usually 16 or 32 bits per pixel (bpp) and in uncompressed tif image file format.

Scalebar options

Scalebar options module screenshot
Scale bar options module.
This module allows to change the scale bar appearance.
Display scale bar
Uncheck to hide the scale bar.
Select from four corner locations for the placement of a scale bar.
Select black or white color of the scale bar.
If checked then add a semi-transparent background.
If the scale bar is white then the background will be black.
If the scale bar is black then the background will be white.

Display transitions

The display transitions module is activated for x-y-energy datasets from material science, side view.

This module allows to enter the energy transition lines to be overlaid on the image display.
In the text input, one should enter a chemical element symbol to select the element's transitions to be overlaid on the image display.
The elements symbols follow the periodic table conventions.
The color coding for energy lines follows the colors of the molecular visualizer Jmol.
Display transitions module screenshot
Display transitions module.

Nearby transitions

The display transitions module is activated for x-y-energy datasets from material science, side view.

The nearby transitions module display the proximity ranked list of all transitions close to the cursor position.
"Energy" corresponds to the energy level under the cursor.
The nearby transitions in the table are sorted by proximity to the cursor (the closest appears first).
The table is updated every time the cursor move over the image.
Nearby transitions module screenshot
Nearby transitions module.

Colony features

The colony features module is activated for x-y-time datasets from cell biology.

A left click on a colony will trigger a display of its bounding box and centroid, and a pop-up dialog with all pre-computed colony features. The information about each colony is presented in a distinct color so that multiple colonies can be explored simultaneously.
For details on the colony features, refer to the Stem Cell Features help.

Colony features module screenshot
Colony features module.

Distance measurement

This module allows to measure and display distance after selecting a starting point and an ending point on an image display. To enable this function, the first step is to activate the module by clicking the checkbox "Active Measurement". After choosing the starting point and the ending point, the module will show the measurements on the left side of the image.

This module also provides the functions of removing measurement and exporting the measurements to CSV file.

Reminder: Remember to uncheck the "Active Measurement" checkbox when completing the interaction using this wizard in order to enable full functionality of other interaction wizards.

Distance measurement module screenshot
Distance measurement module.

Object Fetching

Object fetching module screenshot
Object Fetching module.
This module is designed to download the objects associating over time (colony trackers). User can activate this module by checking the "Active Object Fetching". Multiple objects can be selected by clicking on predefined areas. The module will display the object information that can be modified by specifing the range of the frames and layer type, or removal the object.
The frame identification ("FID") field is for specifying which frames. For example, entering 1-5 14-16 20 <5 >150 into the "FID" edit box will lead to downloading frames 1, 2, 3, 4, 5, 14, 16,20 and any frame ID greated than 150. Another example shown in Figure 14 illustrates 3 selected colony objects, 3 ranges of frames, and also 2 layers.
The downloading are triggered by clicking the "Fetch" button. The download will start automatically after the zip file is prepared on the server.
The zip file contains images and provenance information file.

Reminder: Please remember to uncheck the "Active Object Fetching" checkbox when completing the interaction using this wizard in order to enable full functionality of other interaction wizards.