openseadragon: DeepZoom with DisplayRects (from Deep Zoom Composer) doesn't work

Hello.

Thank you for developing OpenSeadragon. It is really great for large images.

I’m trying to get a DeepZoom created with Deep Zoom Composer to work. Unfortunately no image shows. Only the controls appear.

I’m pointing OpenSeadragon to a dzc_output.xml file and there is a dzc_output_files directory right next to it. When I debug the network activity I can see that dzc_output.xml is successfully loaded but none of the images in dzc_output_files does ever get loaded.

I’ve tried replacing my Deep Zoom with the one called duomo from the example images. It works perfectly fine. I then tried copying my Deep Zoom over duomo, i.e. using the same file names. Again no image shows.

The above makes me suspect that the Deep Zoom created by Deep Zoom Composer is somehow incompatible with OpenSeadragon.

Below I’ve pasted the content of dzc_output.xml.

<?xml version="1.0" encoding="utf-8"?>
<Image xmlns="http://schemas.microsoft.com/deepzoom/2009" TileSize="256" Overlap="1" Format="jpg" ServerFormat="Default">
<Size Width="156481" Height="19588"/>
<DisplayRects>
    <DisplayRect MinLevel="0" MaxLevel="9">
        <Rect X="0" Y="0" Width="156481" Height="19588"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="151207" Y="7951" Width="5274" Height="5792"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="144424" Y="7374" Width="6783" Height="6849"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="132701" Y="6605" Width="11723" Height="7816"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="126500" Y="5779" Width="12376" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="120868" Y="6107" Width="12073" Height="8048"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="117320" Y="5779" Width="7386" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="104708" Y="5718" Width="12612" Height="8408"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="100331" Y="5123" Width="7899" Height="8601"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="94800" Y="4998" Width="5531" Height="9286"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="84923" Y="4927" Width="9877" Height="9845"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="77817" Y="3539" Width="7106" Height="11345"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="66832" Y="3133" Width="10985" Height="11751"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="16128" Y="0" Width="24130" Height="16086"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="0" Y="1454" Width="27201" Height="18134"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="55423" Y="2580" Width="11409" Height="13053"/>
    </DisplayRect>
    <DisplayRect MinLevel="10" MaxLevel="10">
        <Rect X="34833" Y="2360" Width="20590" Height="13726"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="151207" Y="7951" Width="5274" Height="5792"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="144424" Y="7374" Width="6783" Height="6849"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="132701" Y="6605" Width="11723" Height="7816"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="126500" Y="5779" Width="12376" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="120868" Y="6107" Width="12073" Height="8048"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="117320" Y="5779" Width="7386" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="104708" Y="5718" Width="12612" Height="8408"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="100331" Y="5123" Width="7899" Height="8601"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="94800" Y="4998" Width="5531" Height="9286"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="84923" Y="4927" Width="9877" Height="9845"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="77817" Y="3539" Width="7106" Height="11345"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="66832" Y="3133" Width="10985" Height="11751"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="16128" Y="0" Width="24130" Height="16086"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="0" Y="1454" Width="27201" Height="18134"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="55423" Y="2580" Width="11409" Height="13053"/>
    </DisplayRect>
    <DisplayRect MinLevel="11" MaxLevel="11">
        <Rect X="34833" Y="2360" Width="20590" Height="13726"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="151207" Y="7951" Width="5274" Height="5792"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="144424" Y="7374" Width="6783" Height="6849"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="132701" Y="6605" Width="11723" Height="7816"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="126500" Y="5779" Width="12376" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="120868" Y="6107" Width="12073" Height="8048"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="117320" Y="5779" Width="7386" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="104708" Y="5718" Width="12612" Height="8408"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="100331" Y="5123" Width="7899" Height="8601"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="94800" Y="4998" Width="5531" Height="9286"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="84923" Y="4927" Width="9877" Height="9845"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="77817" Y="3539" Width="7106" Height="11345"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="66832" Y="3133" Width="10985" Height="11751"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="16128" Y="0" Width="24130" Height="16086"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="0" Y="1454" Width="27201" Height="18134"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="55423" Y="2580" Width="11409" Height="13053"/>
    </DisplayRect>
    <DisplayRect MinLevel="12" MaxLevel="12">
        <Rect X="34833" Y="2360" Width="20590" Height="13726"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="151207" Y="7951" Width="5274" Height="5792"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="144424" Y="7374" Width="6783" Height="6849"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="132701" Y="6605" Width="11723" Height="7816"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="126500" Y="5779" Width="12376" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="120868" Y="6107" Width="12073" Height="8048"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="117320" Y="5779" Width="7386" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="104708" Y="5718" Width="12612" Height="8408"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="100331" Y="5123" Width="7899" Height="8601"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="94800" Y="4998" Width="5531" Height="9286"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="84923" Y="4927" Width="9877" Height="9845"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="77817" Y="3539" Width="7106" Height="11345"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="66832" Y="3133" Width="10985" Height="11751"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="16128" Y="0" Width="24130" Height="16086"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="0" Y="1454" Width="27201" Height="18134"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="55423" Y="2580" Width="11409" Height="13053"/>
    </DisplayRect>
    <DisplayRect MinLevel="13" MaxLevel="13">
        <Rect X="34833" Y="2360" Width="20590" Height="13726"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="151207" Y="7951" Width="5274" Height="5792"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="144424" Y="7374" Width="6783" Height="6849"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="132701" Y="6605" Width="11723" Height="7816"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="126500" Y="5779" Width="12376" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="120868" Y="6107" Width="12073" Height="8048"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="117320" Y="5779" Width="7386" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="104708" Y="5718" Width="12612" Height="8408"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="100331" Y="5123" Width="7899" Height="8601"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="94800" Y="4998" Width="5531" Height="9286"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="84923" Y="4927" Width="9877" Height="9845"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="77817" Y="3539" Width="7106" Height="11345"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="66832" Y="3133" Width="10985" Height="11751"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="16128" Y="0" Width="24130" Height="16086"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="0" Y="1454" Width="27201" Height="18134"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="55423" Y="2580" Width="11409" Height="13053"/>
    </DisplayRect>
    <DisplayRect MinLevel="14" MaxLevel="14">
        <Rect X="34833" Y="2360" Width="20590" Height="13726"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="151207" Y="7951" Width="5274" Height="5792"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="144424" Y="7374" Width="6783" Height="6849"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="132701" Y="6605" Width="11723" Height="7816"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="126500" Y="5779" Width="12376" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="120868" Y="6107" Width="12073" Height="8048"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="117320" Y="5779" Width="7386" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="104708" Y="5718" Width="12612" Height="8408"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="100331" Y="5123" Width="7899" Height="8601"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="94800" Y="4998" Width="5531" Height="9286"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="84923" Y="4927" Width="9877" Height="9845"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="77817" Y="3539" Width="7106" Height="11345"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="66832" Y="3133" Width="10985" Height="11751"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="16128" Y="0" Width="24130" Height="16086"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="0" Y="1454" Width="27201" Height="18134"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="55423" Y="2580" Width="11409" Height="13053"/>
    </DisplayRect>
    <DisplayRect MinLevel="15" MaxLevel="15">
        <Rect X="34833" Y="2360" Width="20590" Height="13726"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="151207" Y="7951" Width="5274" Height="5792"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="144424" Y="7374" Width="6783" Height="6849"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="132701" Y="6605" Width="11723" Height="7816"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="126500" Y="5779" Width="12376" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="120868" Y="6107" Width="12073" Height="8048"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="117320" Y="5779" Width="7386" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="104708" Y="5718" Width="12612" Height="8408"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="100331" Y="5123" Width="7899" Height="8601"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="94800" Y="4998" Width="5531" Height="9286"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="84923" Y="4927" Width="9877" Height="9845"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="77817" Y="3539" Width="7106" Height="11345"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="66832" Y="3133" Width="10985" Height="11751"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="16128" Y="0" Width="24130" Height="16086"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="0" Y="1454" Width="27201" Height="18134"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="55423" Y="2580" Width="11409" Height="13053"/>
    </DisplayRect>
    <DisplayRect MinLevel="16" MaxLevel="16">
        <Rect X="34833" Y="2360" Width="20590" Height="13726"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="151207" Y="7951" Width="5274" Height="5792"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="144424" Y="7374" Width="6783" Height="6849"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="132701" Y="6605" Width="11723" Height="7816"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="126500" Y="5779" Width="12376" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="120868" Y="6107" Width="12073" Height="8048"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="117320" Y="5779" Width="7386" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="104708" Y="5718" Width="12612" Height="8408"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="100331" Y="5123" Width="7899" Height="8601"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="94800" Y="4998" Width="5531" Height="9286"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="84923" Y="4927" Width="9877" Height="9845"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="77817" Y="3539" Width="7106" Height="11345"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="66832" Y="3133" Width="10985" Height="11751"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="16128" Y="0" Width="24130" Height="16086"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="0" Y="1454" Width="27201" Height="18134"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="55423" Y="2580" Width="11409" Height="13053"/>
    </DisplayRect>
    <DisplayRect MinLevel="17" MaxLevel="17">
        <Rect X="34833" Y="2360" Width="20590" Height="13726"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="151207" Y="7951" Width="5274" Height="5792"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="144424" Y="7374" Width="6783" Height="6849"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="132701" Y="6605" Width="11723" Height="7816"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="126500" Y="5779" Width="12376" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="120868" Y="6107" Width="12073" Height="8048"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="117320" Y="5779" Width="7386" Height="8251"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="104708" Y="5718" Width="12612" Height="8408"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="100331" Y="5123" Width="7899" Height="8601"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="94800" Y="4998" Width="5531" Height="9286"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="84923" Y="4927" Width="9877" Height="9845"/>
    </DisplayRect>
    <DisplayRect MinLevel="18" MaxLevel="18">
        <Rect X="67906" Y="3539" Width="17017" Height="11345"/>
    </DisplayRect>
</DisplayRects>
</Image>

About this issue

  • Original URL
  • State: open
  • Created 8 years ago
  • Comments: 43 (14 by maintainers)

Most upvoted comments

@iangilman

Retreat, hell!

You are right, I am sorry for creating this confusion. I mixed it up with some other issue I once encountered with the xmlns schema. Mea culpa … In a quick test, I dit not referenz the tilesources via “dzc_output.xml”, but with my usual variable … and of course this way it did work for me. I promise 😇 never to examine ancient DZI files again in the future — is that a deal?

Anyway, we’re attacking in a different direction!

@brentkendall Again, Sorry for this confusion. In my opinion, you should stay away from DZC because of this huge “single high-resolution image” and the unnessary amount of tiles. Ian is pointing you in the right direction.

A brief note to your screenshot: In case you want the monalisa.jpg non zoomable and given the size of monalisa.jpg (1433x1920 px), you could use it as background-image for the viewer-div similar like this:

<div id="osd-viewer" style="background-image: url('img/assets/monalisa.jpg');background-size:cover;"></div>

and deliver the other images via OSD-viewer on top.

Btw, if you want non-rectangular sub-images, make them as PNGs and then create PNG tiles with them.

I wanted to add to this as I’ve found DZC less useful over time due to various problems such as the one above. I installed VIPS and finally figured out how to make it work (not very well documented). In MS Windows: Downloaded from: http://www.vips.ecs.soton.ac.uk/index.php?title=VIPS The trick is to put your source file in the VIPS bin folder, then I open a command line there and use the format: vips dzsave filename.extension folderoutputname

Example for a JPG named myfile: vips dzsave myfile.jpg myfile This generates a dzi and associated tilesource folder.

It is VERY FAST, and there are many parameters that can be changed.

Just my 2 cents…