Merge pull request #7221 from thhomas/zoomify-update-iip

update zoomify source to accept tileIndex placeholders and handle iip…
This commit is contained in:
Andreas Hocevar
2017-09-07 12:55:13 +02:00
committed by GitHub
5 changed files with 102 additions and 42 deletions

View File

@@ -3,7 +3,13 @@ layout: example.html
title: Zoomify
shortdesc: Example of a Zoomify source.
docs: >
Zoomify is a format for deep-zooming into high resolution images. This example shows how to use the Zoomify source with a pixel projection.
tags: "zoomify, deep zoom, pixel, projection"
Zoomify is a format for deep-zooming into high resolution images. This example shows how to use the Zoomify source with a pixel projection. Internet Imaging Protocol (IIP) with JTL extension is also handled.
tags: "zoomify, deep zoom, IIP, pixel, projection"
---
<div id="map" class="map"></div>
<div class="controls">
<select id="zoomifyProtocol">
<option value="zoomify">Zoomify</option>
<option value="iip">IIP</option>
</select>
</div>

View File

@@ -6,26 +6,47 @@ goog.require('ol.source.Zoomify');
var imgWidth = 9911;
var imgHeight = 6100;
var source = new ol.source.Zoomify({
url: 'http://vips.vtech.fr/cgi-bin/iipsrv.fcgi?zoomify=' +
'/mnt/MD1/AD00/plan_CHU-4HD-01/FOND.TIF/',
size: [imgWidth, imgHeight],
crossOrigin: 'anonymous'
var zoomifyUrl = 'http://vips.vtech.fr/cgi-bin/iipsrv.fcgi?zoomify=' +
'/mnt/MD1/AD00/plan_CHU-4HD-01/FOND.TIF/';
var iipUrl = 'http://vips.vtech.fr/cgi-bin/iipsrv.fcgi?FIF=' + '/mnt/MD1/AD00/plan_CHU-4HD-01/FOND.TIF' + '&JTL={z},{tileIndex}';
var layer = new ol.layer.Tile({
source: new ol.source.Zoomify({
url: zoomifyUrl,
size: [imgWidth, imgHeight],
crossOrigin: 'anonymous'
})
});
var extent = [0, -imgHeight, imgWidth, 0];
var map = new ol.Map({
layers: [
new ol.layer.Tile({
source: source
})
],
layers: [layer],
target: 'map',
view: new ol.View({
// adjust zoom levels to those provided by the source
resolutions: source.getTileGrid().getResolutions(),
resolutions: layer.getSource().getTileGrid().getResolutions(),
// constrain the center: center cannot be set outside this extent
extent: extent
})
});
map.getView().fit(extent);
var control = document.getElementById('zoomifyProtocol');
control.addEventListener('change', function(event) {
var value = event.currentTarget.value;
if (value === 'iip') {
layer.setSource(new ol.source.Zoomify({
url: iipUrl,
size: [imgWidth, imgHeight],
crossOrigin: 'anonymous'
}));
} else if (value === 'zoomify') {
layer.setSource(new ol.source.Zoomify({
url: zoomifyUrl,
size: [imgWidth, imgHeight],
crossOrigin: 'anonymous'
}));
}
});