File formats and the generation of pyramidal images

Images prepared for presentation with Seadragon are converted into hundreds if not thousands of individual files arranged into particular folders representing each available level of zoom. A detailed description of the structure and naming conventions can be found here. This system is fairly simple for small collections of images but can be more problematic to administer when dealing with larger collections or individual images being reused in multiple collections.

In contrast images prepared for use with the IIPImage server are converted into single pyramidal image files, holding all of the various levels of detail together. A detailed description of these pyramidal images and how they can be generated can be found here.

Although there are a number of IIPImage clients, see here or here, that can be used to present image content, the IIPImage sever can also be used to present image tiles to the Seadragon system, allowing all of the Seadragon specific functionality, but with a far smaller set of files to organise and administer. This process is still being improved, but the initial examples presented in this website clearly indicate the combination of the two systems work well together.

Generating and using colour palettes

Images can be made up of a huge range of colours, for example a normal colour (8-bit, RGB) image can be made up of a mixture of 16 million possible colours. However, if you blend all of these colours together, for a given image, you can calculated its average colour. For this project an image of each of the National Gallery paintings was processed, in this way, and the average colours where recorded, with any duplicate colours being dis-guarded. This produced a set of 2051 unique colours, which can be seen here.

The set of image used in this process are a variety of different dimensions, fitting the shapes of the various paintings. When these images are automatically joined together to form collections it makes it much easier to pad out the background of each to form a square, to allow the images to fit together in a grid. For this this particular project the background of each image was increased to form a 6000x6000px square using each image's average colour, see figure below.

Averaging The Umbrellas, by Pierre-Auguste Renoir.					Average colour	Painting with average background.

Generating text from images

There are a number of different ways to add text into images, most pieces of image processing software will allow the user to put text into an image, alter its size and font and so on. However for this particular project a more automated process was required to pull information from several different databases and format it for each image. This was achieved using a combination of the python scripting language and the appropriate sections of the VIPS image processing libraries.

Generating a Seadragon collection

For a Seadragon collection to work you will need:

• A prepared source images, along with basic XML meta-data
• A prepared collection images, used as a user zooms out to see large parts of a collection rather than individual images.
• A detailed XML document, dzc_output.xml, describing the relative sizes and positions of all of the images in the collection.
• A detailed XML document, scene.xml, describing how the images are presented and how a user can interact with them.
• Other XML documents are produced but they do not directly effect the examples given here.

To produce these resource the following steps followed:

• An existing collection of images where processed to produce a colour palette and a new set of square images with colour backgrounds, as shown above.
• A collection was planned and a list of images generated:
• For a general grid collection a simple list of images was generated, in a pre-defined order.
• For the Painting with the collection examples:
• A small template image was selected and resized to around 128x128px.
• The template image was then simplified so that all of the colours in the processed images where present in the NG colour palette.
• Each pixel in the template image was then matched to a particular painting in the collection to produce a simple list of images.
• For the Adding text into a collection example:
  • A series of database queries where performed to gather the painting and image tombstone data.
  • The tombstone data was used to create the appropriate text images.
  • The plan and the image meta data was used to create a simple list of images
• The collection plan, the simple image list and the related image meta data was then used to automatically calculated all of the relative sizes and positions required to generate the final XML documents.
• Finally the XML documents and the original images where used to automatically generate the prepared collection images.