CODEWITHSUNDEEP
openseadragon
osk386
osk386

Reputation: 514

How to control the loading order of multiple images in openseadragon

In my situation, I have 10 images loaded in a viewer with the same bounds. each image is arranged one behind other.

// source is an array of url images.

for(i=0;i < source.length-1;i++){
        this.viewer.addTiledImage({
                tileSource: source[i],
                index: i,
                opacity:0
            });
}

My intention is to control opacity of each image using a slider (range input), the slider set the correspondent image opacity to 1, and let the others with no opacity. This works well.

The idea is preload images and change images smoothly.

The problem

All images are loaded at same time when zooming or panning, so I want to control the load order and give priority to the visible image then load the next image, and so on.

How can I do that? I can't find any method to pause the loading of tiles.

Thanks for your help.

Upvotes: 0

Views: 1399

Answers (2)

osk386
osk386

Reputation: 514

I can fix my issue by controlling opacity instead of control network download, openseadragon has no method to control the download order at dzi image level, so the way is control the opacity because 0 opacity don't do any download. Thanks to the openseadragon contributors for help me to solve this issue.

https://github.com/openseadragon/openseadragon/issues/971

Upvotes: 0

MindFreeze
MindFreeze

Reputation: 445

You can try using the 'open' event and adding the next image once the previous one has loaded. Something like:

var i =0, viewer = this.viewer;
viewer.addTiledImage({
    tileSource: source[i],
    index: i,
    opacity:0
});
viewer.addHandler('open', function() {
    i++;
    if (source[i]) {
        viewer.addTiledImage({
            tileSource: source[i],
            index: i,
            opacity:0
        });
    } else {
        viewer.removeAllHandlers('open');
    }
});

Note that this is untested sample code but you should get the idea. And you should actually use removeHandler() instead of removeAllHandlers(), but this is just an example.

Upvotes: 1

Related Questions