This example does not use existing IIIF images. Instead it takes the public domain images from the Metropolitan Museum of Art’s digital collection. Specifically I downloaded all the images in the Unicorn Tapestries.

Then I resized the images so they were all the same height using GIMP.

I stitched the images together using Imagemagick in the command line. The command to stitch images together is: convert [file1] [file2] [file3] +append [outputfile]. This will work with 2 or more files.

From there I followed the instructions in Creating IIIF images page.

This storyboard uses multiple settings:

  • overlaycolor: white
  • activecolor: white
  • fit: horizontal
  • overlaynext: true
  • annoview: collapse
  • CSS sets height to auto; Default for the collapse view is an 100% height;