Table of Contents
For a general overview, see https://msdn.microsoft.com/en-us/library/cc645077(VS.95).aspx.
The Tile Pyramid
When creating a DZI image, you specify a size, format, and overlap. The conversion tool then goes through the image, breaking it into tiles. It starts with the full resolution image, and starts creating tiles from the upper left corner, with the first tile being 0_0, the next in the top row being 1_0, etc. The first tile on the next row is 0_1, etc. This becomes the highest-numbered layer.
The tool then scales the image down to half width, rounding odd-sized image sizes up, and runs through and tiles it again, using the same numbering system. This becomes the next level.
The tool continues scaling down by half and outputting new levels until the image is down to approximately 1px wide. This is the lowest level, and it's designated level 0. The next level above it is level 1, etc.
Overlap
Tile overlap (if any) is added in addition to the normal tile size. Note that tile overlaps are on both sides of the join, so a one pixel overlap (for example) means tiles 0_0 and 1_0 have two columns of pixels in common.
The tile size is usually chosen so that non-edge tiles are a power of two along the side. With overlap one and tile size 254, tile 0_0 will be 255x255, but all non-edge tiles will be 256x256.
Tiles are written even if they contribute no new pixels to the image. With overlap one, for example, you can have a two-pixel edge tile which simply repeats pixels in the previous tile.
Here is an example of a 8 x 4 image with a tile size of 3 and an overlap of 1.
6 tiles would be generated:
|
Folder Structure
Metadata about the file is stored in an XML file using either the .dzi or .xml file extension, e.g. example.dzi. The tiles are stored in a folder next to it, named e.g. example_files. The tile of the lowest level in this example would be example_files/0/0_0.jpg
.
Reference
From @gasi:
- http://www.gasi.ch/blog/inside-deep-zoom-1
- http://www.gasi.ch/blog/inside-deep-zoom-2
- http://www.gasi.ch/blog/inside-deep-zoom-3
From @benvanik (also see: https://web.archive.org/web/20180330212627/http://benvanik.tumblr.com/tagged/zooming):
- https://web.archive.org/web/20180228054336/http://benvanik.tumblr.com/post/13883153608/high-res-zooming-images-are-easy
- https://web.archive.org/web/20180228054341/http://benvanik.tumblr.com/post/13931208153/deepzoomseadragon-and-image-pyramids
- https://web.archive.org/web/20180228053736/http://benvanik.tumblr.com/post/13941606764/tile-sizes
- https://web.archive.org/web/20180228054623/http://benvanik.tumblr.com/post/13978156533/tile-overlap
- https://web.archive.org/web/20180228055545/http://benvanik.tumblr.com/post/14027494017/temporal-blending-animation-is-an-art
- https://web.archive.org/web/20180228053331/http://benvanik.tumblr.com/post/14079110659/spatial-blending-keeping-it-smooth
- https://web.archive.org/web/20180228054346/http://benvanik.tumblr.com/post/14127398599/spatial-blending-softening-the-edges
- https://web.archive.org/web/20180330195644/http://benvanik.tumblr.com/post/14176690650/clipping-and-lod-in-2d
- https://web.archive.org/web/20180330195649/http://benvanik.tumblr.com/post/14222411302/drawing-an-image-pyramid
- https://web.archive.org/web/20180228054311/http://benvanik.tumblr.com/post/14225281899/simple-image-pyramid-demo-in-500-lines-of