Web Image Browser (a.k.a. WIB or WIB2 or FlexImageBrowser) is a web based application for viewing and annotating large 2D and 3D microscopic images indexed by the Cell Centered Database (CCDB). Both WIB and CCDB are projects undertaken at the National Center for Microscopy and Imaging Research at the University of California, San Diego. The sole author of WIB is Steve Lamont. I'm hoping one day to be able to add some code to WIB, but currently I'm working on my own project where I make use of Steve's very versatile "WIB Image Server" to load tiles. On this page I have my own notes to help me understand the code.
More official web pages for the WIB are here:
- Developer page - information for developers
- Source forge - source code repository ***
- Users manual - small wiki page explaining how to use WIB
- Open CCDB Software listing - lists WIB plus several other CCDB projects (including Jinx and Cytoseg).
- Front page of Open CCDB - there is currently a small demo of WIB on the front page of openCCDB (CCDB's wiki).
- WIB Demo - shows a full screen demo of WIB in action. Noticed WIB is fed an "imagePath" argument as a URL where the data is located in the URL. Another WIB Demo.
- "Tirebiter" - a place where new iterations of WIB are tested.
- Tirebiter - Image Manager notes - notes on the "Image Manager" which delivers tiles to WIB.
Showing Data in WIB
A version of WIB runs on our "firstsun.ucsd.edu" server, so the easiest way to showcase data in WIB is to copy it to a volume such as "tera1" (connect to server: "smb://firstsun.ucsd.edu/tera1/"), create your own directory and then drag in your dataset. Of course to do this you'll have to have a NCMIR account. Many 2D and 3D image formats are supported (see list here), I like to use .mrc. To display it in WIB you'll now need to copy the filepath into the URL as per these example:
Loading Tiles via the WIB Image Server
To understand how WIB takes an image file and dynamically generates PNG tiles you'll have to read about the WIB ImageManager protocol. Following the first example above, you would access the tile at level 0 (the furtherest zoomed out) like this:
The parameters are as follows:
- transaction set the transaction type.... here we want to download a "tile", which WIB always delivers as a PNG. Other options are: "dimensions" - returns the dimensions of the image in plaintext form, "thumbnail" - returns a thumbnail of the image no more than 128x128 and "metadata" - support for CCDB.
- qr, qi, qj, qk represents the four parameters of a quaternion. The WIB image server can use this to deliver tiles cut at any rotation!... in most cases you won't want any rotation and thus should be able to omit these paramters.
- level refers to the "level" of tile where a level of 0 encompasses the entire image in a single tile.... level 1 is most likely 2x2 tiles and so on. Since the original image is probably not a power of two in each dimension, tiles at the edge will usually not be full (128x128) tiles... and at the higher levels it's unlikely the number of tiles along each axis will be a power of two.
- offset dictates which slice to retrieve, measured from the middle such that: offset = z- ((nslices-1)/2.0).
- i, j these dictate which tile to access along the x axis (i) and y axis (j) starting at the top left.
- type represents the type of image format being accessed. In this case it's an MRC which is listed as a "volume" file.... for 2D files there are several options.
Here's another example of accessing a tile... this time the image is 2D and has been pre-processed into zoomify format. Since it's only 2D the offset and quaternion components don't apply.
My Personal Notes on WIB Code
After downloading and unzipping the tar ball from here.... The main Action Script code is under: src/edu/ucsd/ncmir/FIB
The main file here is Viewport.as - this has most of the program logic, and by far the biggest file ~2500 lines. Every other file is <350 lines and almost all of them are implementation of GUI classes.
The next most important file is TraceShape.as - is the equivalent of a "Contour" class in that it contain point data. TraceShape extends AbstractTrace extends AbstractShape extends Shape.
- Flash Developer Center - official guides for using Flash.