Skip to content

Instantly share code, notes, and snippets.

@bdunnette

bdunnette/aperio-get-image.md

Last active January 3, 2016 22:59
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save bdunnette/8531994 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save bdunnette/8531994 to your computer and use it in GitHub Desktop.
Download ZIP
A demonstration of using Leaflet to load WSI tiles directly from Aperio ImageServer.
Raw
aperio-get-image.md

GET image?x+y+w+h+z+q+m+f+r ‐ returns region from image file

Returns region from an Aperio image file (SVS) at the specified image path. The region is returned as a JPEG image. The following parameters may be supplied:

  • x X‐coordinate of region, in pixels (upper left is [0,0]). Default is 0.

  • y Y‐coordinate of region, in pixels (upper left is [0,0]). Default is 0.

  • w width of region, in pixels. Maximum width is 2000 pixels. Default is image width or 2000, whichever is less.

  • h height of region, in pixels. Maximum height is 2000 pixels. Default is image height or 2000, whichever is less.

  • z zoom level of region (float), .5 = 200%, 2 = 50%, 4 = 25%. Other special values:

    • ‐1 = thumbnail image
    • ‐2 = label image (if any)
    • ‐3 = macro camera image (if any)

    The default value for zoom is 1 (= 100%)

  • q JPEG quality level, (1‐100). A level of 75 approximately corresponds to the JPEG2000 image quality. Default is 75.

  • m JPEG mode. If specified as S images will be static (non‐progressive). Default is progressive (P). {Ordinarily progressive mode is “better” however some software cannot handle progressive JPEGs, notably Macromedia Flash.}

  • f focus value for region (float), in range ‐1 ‐> +1 (with 0 at “center”). Default is 0.

  • r random string value. Not used by ImageServer, but can be used to ensure that the URL is unique. This is useful for defeating browser caching.

If x and y are specified with a leading 0, they are relative to the image base, else they are relative to the zoomed image. Note that smaller zoom values result in higher resolution [this is why we use zoomReverse: true when configuring leaflet].

If focus is specified, it is in the range ‐1 to +1, with 0 at “center” of image. Currently focusing is only supported along the Z‐axis. Focus values only affect 3D images.

An image thumbnail may be requested by specifying a zoom level of ‐1. For this case, the x and y are ignored, and the w and h give the dimensions of the returned thumbnail (which is scaled appropriately). A width or height value of zero causes the image aspect ratio to be preserved; if both are zero, the “native” size of the thumbnail is used.

The label image associated with the image file may be requested by specifying a zoom of ‐2.

This is enabled by the –label parameter. For this case, the x and y are ignored, and the w and h give the dimensions of the returned label image (which is scaled appropriately). A width or height value of zero causes the label image aspect ratio to be preserved; if both are zero, the “native” size of the label image is used.

The macro camera image associated with the image file may be requested with a zoom of ‐3. For this case, the x and y are ignored, and the w and h give the dimensions of the returned macro camera image (scaled appropriately). A width or height value of zero causes the macro camera image aspect ratio to be preserved; if both are zero, the “native” size of the macro camera image is used. If the mactrim parameter is given, the macro image is cropped by the specified %.

GET image?INFO(+I) ‐ returns file information

Returns image file information for the specified image as a single line with the format: 

width|height|twidth|theight(|TML)|title|desc

Where the fields mean: 

  • width: width of image in pixels 
  • height: height of image in pixels
  • twidth: tile width in pixels (0 => not tiled) 
  • theight: tile height in pixels (0 => not tiled) 
  • TML: TML are each 0/1, whether image has thumbnail, macro, and label (only returned on INFO+I requests)
  • title: file title, if any 
  • desc: file description (from TIFF header), if any 
Raw
aperio-leaflet.html
<!DOCTYPE html>
<html>
<head>
<title>Leaflet + Aperio ImageServer Example</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css" />
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script src="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.js"></script>
</head>
<body>
<div id="map" style="height: 600px"></div>
<script>
var map = L.map('map', {
crs: L.CRS.Simple,
maxZoom: 18
}).setView([85, 120], 14);
// Converting image pixels to latlng, per http://stackoverflow.com/a/15170828
var southWest = map.unproject([0, 25370], map.getMaxZoom());
var northEast = map.unproject([72000, 0], map.getMaxZoom());
map.setMaxBounds(new L.LatLngBounds(southWest, northEast));
L.tileLayer('http://images.pathology.umn.edu/imageserver/Projects/AIRP/U13-9398/55602.svs?{x}+{y}+1024+1024+{z}', {
noWrap: true,
zoomReverse: true,
//zoomOffset: 10,
tileSize: 1024,
tms: true,
attribution: 'Images &copy; Ajay Rawal, MD'
}).addTo(map);
function onMapMove(e) {
console.log('Center:' + map.getCenter() + ' Zoom:' + map.getZoom());
}
map.on('moveend', onMapMove);
// global vars
var winHeight = $(window).height();
// set initial div height / width
$('#map').css({
'height': winHeight,
});
// make sure div stays full width/height on resize
$(window).resize(function(){
var winHeight = $(window).height();
$('#map').css({
'height': winHeight,
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment