CINXE.COM
Viewers – IIPImage
<!DOCTYPE html> <html lang="en-US"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-title" content="IIPImage - "> <link rel="profile" href="http://gmpg.org/xfn/11"> <link rel="pingback" href="https://iipimage.sourceforge.io/xmlrpc.php"> <link rel="Shortcut Icon" type="image/x-icon" href="/images/iip-favicon.png"/> <meta name="author" content="Ruven Pillay <ruven@users.sourceforge.io>" /> <meta name="keywords" content="IIPImage, Internet Imaging Protocol, IIP, Image Server, Visualization, High Resolution, TIFF, JPEG2000, HTML5, Multispectral, IIIF" /> <meta name="description" content="IIPImage is a high-performance image server and client for web-based streamed high resolution scientific imagery" /> <meta name="copyright" content="© 2000-2024 Ruven Pillay, All rights reservied" /> <!-- Facebook OpenGraph Metadata --> <meta property="fb:app_id" content="208864689213" /> <meta property="fb:admins" content="657173239" /> <meta property="og:site_name" content="IIPImage"/> <meta property="og:title" content="IIPImage » Viewers"/> <meta property="og:type" content="website"/> <meta property="og:image" content="https://iipimage.sourceforge.io/images/iip_logo.png"/> <meta property="og:description" content="IIPImage is a high-performance image server and client for web-based streamed high resolution scientific imagery"/> <meta property="og:url" content="https://iipimage.sourceforge.io/documentation/viewers"/> <!-- Twitter Card Metadata --> <meta name="twitter:card" content="summary"> <meta name="twitter:site" content="@iipimage"> <meta name="twitter:creator" content="@iipimage"> <meta name="twitter:title" content="IIPImage » Viewers"> <meta name="twitter:image" content="https://iipimage.sourceforge.io/images/iip_logo.png"> <meta name="twitter:description" content="IIPImage is a high-performance image server and client for web-based streamed high resolution scientific imagery"> <!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-7S46T8G8KM"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-7S46T8G8KM'); gtag('require', 'linkid'); </script> <title>Viewers – IIPImage</title> <meta name='robots' content='max-image-preview:large' /> <link rel="alternate" type="application/rss+xml" title="IIPImage » Feed" href="https://iipimage.sourceforge.io/feed" /> <link rel="alternate" type="application/rss+xml" title="IIPImage » Comments Feed" href="https://iipimage.sourceforge.io/comments/feed" /> <script> window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/svg\/","svgExt":".svg","source":{"concatemoji":"https:\/\/iipimage.sourceforge.io\/wp-includes\/js\/wp-emoji-release.min.js?ver=6.2.2"}}; /*! This file is auto-generated */ !function(e,a,t){var n,r,o,i=a.createElement("canvas"),p=i.getContext&&i.getContext("2d");function s(e,t){p.clearRect(0,0,i.width,i.height),p.fillText(e,0,0);e=i.toDataURL();return p.clearRect(0,0,i.width,i.height),p.fillText(t,0,0),e===i.toDataURL()}function c(e){var t=a.createElement("script");t.src=e,t.defer=t.type="text/javascript",a.getElementsByTagName("head")[0].appendChild(t)}for(o=Array("flag","emoji"),t.supports={everything:!0,everythingExceptFlag:!0},r=0;r<o.length;r++)t.supports[o[r]]=function(e){if(p&&p.fillText)switch(p.textBaseline="top",p.font="600 32px Arial",e){case"flag":return s("\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!s("\ud83c\uddfa\ud83c\uddf3","\ud83c\uddfa\u200b\ud83c\uddf3")&&!s("\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!s("\ud83e\udef1\ud83c\udffb\u200d\ud83e\udef2\ud83c\udfff","\ud83e\udef1\ud83c\udffb\u200b\ud83e\udef2\ud83c\udfff")}return!1}(o[r]),t.supports.everything=t.supports.everything&&t.supports[o[r]],"flag"!==o[r]&&(t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&t.supports[o[r]]);t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&!t.supports.flag,t.DOMReady=!1,t.readyCallback=function(){t.DOMReady=!0},t.supports.everything||(n=function(){t.readyCallback()},a.addEventListener?(a.addEventListener("DOMContentLoaded",n,!1),e.addEventListener("load",n,!1)):(e.attachEvent("onload",n),a.attachEvent("onreadystatechange",function(){"complete"===a.readyState&&t.readyCallback()})),(e=t.source||{}).concatemoji?c(e.concatemoji):e.wpemoji&&e.twemoji&&(c(e.twemoji),c(e.wpemoji)))}(window,document,window._wpemojiSettings); </script> <style> img.wp-smiley, img.emoji { display: inline !important; border: none !important; box-shadow: none !important; height: 1em !important; width: 1em !important; margin: 0 0.07em !important; vertical-align: -0.1em !important; background: none !important; padding: 0 !important; } </style> <link rel='stylesheet' id='wp-block-library-css' href='https://iipimage.sourceforge.io/wp-includes/css/dist/block-library/style.min.css?ver=6.2.2' media='all' /> <link rel='stylesheet' id='classic-theme-styles-css' href='https://iipimage.sourceforge.io/wp-includes/css/classic-themes.min.css?ver=6.2.2' media='all' /> <style id='global-styles-inline-css'> body{--wp--preset--color--black: #000000;--wp--preset--color--cyan-bluish-gray: #abb8c3;--wp--preset--color--white: #fff;--wp--preset--color--pale-pink: #f78da7;--wp--preset--color--vivid-red: #cf2e2e;--wp--preset--color--luminous-vivid-orange: #ff6900;--wp--preset--color--luminous-vivid-amber: #fcb900;--wp--preset--color--light-green-cyan: #7bdcb5;--wp--preset--color--vivid-green-cyan: #00d084;--wp--preset--color--pale-cyan-blue: #8ed1fc;--wp--preset--color--vivid-cyan-blue: #0693e3;--wp--preset--color--vivid-purple: #9b51e0;--wp--preset--color--blue: #0d6efd;--wp--preset--color--indigo: #6610f2;--wp--preset--color--purple: #5533ff;--wp--preset--color--pink: #d63384;--wp--preset--color--red: #dc3545;--wp--preset--color--orange: #fd7e14;--wp--preset--color--yellow: #ffc107;--wp--preset--color--green: #198754;--wp--preset--color--teal: #20c997;--wp--preset--color--cyan: #0dcaf0;--wp--preset--color--gray: #6c757d;--wp--preset--color--gray-dark: #343a40;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--duotone--dark-grayscale: url('#wp-duotone-dark-grayscale');--wp--preset--duotone--grayscale: url('#wp-duotone-grayscale');--wp--preset--duotone--purple-yellow: url('#wp-duotone-purple-yellow');--wp--preset--duotone--blue-red: url('#wp-duotone-blue-red');--wp--preset--duotone--midnight: url('#wp-duotone-midnight');--wp--preset--duotone--magenta-yellow: url('#wp-duotone-magenta-yellow');--wp--preset--duotone--purple-green: url('#wp-duotone-purple-green');--wp--preset--duotone--blue-orange: url('#wp-duotone-blue-orange');--wp--preset--font-size--small: 13px;--wp--preset--font-size--medium: 20px;--wp--preset--font-size--large: 36px;--wp--preset--font-size--x-large: 42px;--wp--preset--spacing--20: 0.44rem;--wp--preset--spacing--30: 0.67rem;--wp--preset--spacing--40: 1rem;--wp--preset--spacing--50: 1.5rem;--wp--preset--spacing--60: 2.25rem;--wp--preset--spacing--70: 3.38rem;--wp--preset--spacing--80: 5.06rem;--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);--wp--preset--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);}:where(.is-layout-flex){gap: 0.5em;}body .is-layout-flow > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}body .is-layout-flow > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}body .is-layout-flow > .aligncenter{margin-left: auto !important;margin-right: auto !important;}body .is-layout-constrained > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}body .is-layout-constrained > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}body .is-layout-constrained > .aligncenter{margin-left: auto !important;margin-right: auto !important;}body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)){max-width: var(--wp--style--global--content-size);margin-left: auto !important;margin-right: auto !important;}body .is-layout-constrained > .alignwide{max-width: var(--wp--style--global--wide-size);}body .is-layout-flex{display: flex;}body .is-layout-flex{flex-wrap: wrap;align-items: center;}body .is-layout-flex > *{margin: 0;}:where(.wp-block-columns.is-layout-flex){gap: 2em;}.has-black-color{color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-color{color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-color{color: var(--wp--preset--color--white) !important;}.has-pale-pink-color{color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-color{color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color: var(--wp--preset--color--vivid-purple) !important;}.has-black-background-color{background-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color: var(--wp--preset--color--white) !important;}.has-pale-pink-background-color{background-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color: var(--wp--preset--color--vivid-purple) !important;}.has-black-border-color{border-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color: var(--wp--preset--color--white) !important;}.has-pale-pink-border-color{border-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color: var(--wp--preset--color--vivid-purple) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background: var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background: var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background: var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background: var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background: var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background: var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background: var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background: var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background: var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size: var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size: var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size: var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size: var(--wp--preset--font-size--x-large) !important;} .wp-block-navigation a:where(:not(.wp-element-button)){color: inherit;} :where(.wp-block-columns.is-layout-flex){gap: 2em;} .wp-block-pullquote{font-size: 1.5em;line-height: 1.6;} </style> <link rel='stylesheet' id='understrap-styles-css' href='https://iipimage.sourceforge.io/wp-content/themes/understrap/css/theme.min.css?ver=1.2.2.1680034962' media='all' /> <script src='https://iipimage.sourceforge.io/wp-includes/js/jquery/jquery.min.js?ver=3.6.4' id='jquery-core-js'></script> <script src='https://iipimage.sourceforge.io/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.4.0' id='jquery-migrate-js'></script> <link rel="https://api.w.org/" href="https://iipimage.sourceforge.io/wp-json/" /><link rel="alternate" type="application/json" href="https://iipimage.sourceforge.io/wp-json/wp/v2/pages/18" /><link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://iipimage.sourceforge.io/xmlrpc.php?rsd" /> <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://iipimage.sourceforge.io/wp-includes/wlwmanifest.xml" /> <meta name="generator" content="WordPress 6.2.2" /> <link rel="canonical" href="https://iipimage.sourceforge.io/documentation/viewers" /> <link rel='shortlink' href='https://iipimage.sourceforge.io/?p=18' /> <link rel="alternate" type="application/json+oembed" href="https://iipimage.sourceforge.io/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fiipimage.sourceforge.io%2Fdocumentation%2Fviewers" /> <link rel="alternate" type="text/xml+oembed" href="https://iipimage.sourceforge.io/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fiipimage.sourceforge.io%2Fdocumentation%2Fviewers&format=xml" /> <meta name="mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-title" content="IIPImage - "> <link rel="icon" href="https://iipimage.sourceforge.io/wp-content/uploads/2022/04/iip.ico" sizes="32x32" /> <link rel="icon" href="https://iipimage.sourceforge.io/wp-content/uploads/2022/04/iip.ico" sizes="192x192" /> <link rel="apple-touch-icon" href="https://iipimage.sourceforge.io/wp-content/uploads/2022/04/iip.ico" /> <meta name="msapplication-TileImage" content="https://iipimage.sourceforge.io/wp-content/uploads/2022/04/iip.ico" /> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css?family=Muli&display=swap" rel="stylesheet"> </head> <body class="page-template-default page page-id-18 page-child parent-pageid-24 wp-custom-logo wp-embed-responsive understrap-has-sidebar" itemscope itemtype="http://schema.org/WebSite"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 0 0" width="0" height="0" focusable="false" role="none" style="visibility: hidden; position: absolute; left: -9999px; overflow: hidden;" ><defs><filter id="wp-duotone-dark-grayscale"><feColorMatrix color-interpolation-filters="sRGB" type="matrix" values=" .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 " /><feComponentTransfer color-interpolation-filters="sRGB" ><feFuncR type="table" tableValues="0 0.49803921568627" /><feFuncG type="table" tableValues="0 0.49803921568627" /><feFuncB type="table" tableValues="0 0.49803921568627" /><feFuncA type="table" tableValues="1 1" /></feComponentTransfer><feComposite in2="SourceGraphic" operator="in" /></filter></defs></svg><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 0 0" width="0" height="0" focusable="false" role="none" style="visibility: hidden; position: absolute; left: -9999px; overflow: hidden;" ><defs><filter id="wp-duotone-grayscale"><feColorMatrix color-interpolation-filters="sRGB" type="matrix" values=" .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 " /><feComponentTransfer color-interpolation-filters="sRGB" ><feFuncR type="table" tableValues="0 1" /><feFuncG type="table" tableValues="0 1" /><feFuncB type="table" tableValues="0 1" /><feFuncA type="table" tableValues="1 1" /></feComponentTransfer><feComposite in2="SourceGraphic" operator="in" /></filter></defs></svg><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 0 0" width="0" height="0" focusable="false" role="none" style="visibility: hidden; position: absolute; left: -9999px; overflow: hidden;" ><defs><filter id="wp-duotone-purple-yellow"><feColorMatrix color-interpolation-filters="sRGB" type="matrix" values=" .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 " /><feComponentTransfer color-interpolation-filters="sRGB" ><feFuncR type="table" tableValues="0.54901960784314 0.98823529411765" /><feFuncG type="table" tableValues="0 1" /><feFuncB type="table" tableValues="0.71764705882353 0.25490196078431" /><feFuncA type="table" tableValues="1 1" /></feComponentTransfer><feComposite in2="SourceGraphic" operator="in" /></filter></defs></svg><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 0 0" width="0" height="0" focusable="false" role="none" style="visibility: hidden; position: absolute; left: -9999px; overflow: hidden;" ><defs><filter id="wp-duotone-blue-red"><feColorMatrix color-interpolation-filters="sRGB" type="matrix" values=" .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 " /><feComponentTransfer color-interpolation-filters="sRGB" ><feFuncR type="table" tableValues="0 1" /><feFuncG type="table" tableValues="0 0.27843137254902" /><feFuncB type="table" tableValues="0.5921568627451 0.27843137254902" /><feFuncA type="table" tableValues="1 1" /></feComponentTransfer><feComposite in2="SourceGraphic" operator="in" /></filter></defs></svg><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 0 0" width="0" height="0" focusable="false" role="none" style="visibility: hidden; position: absolute; left: -9999px; overflow: hidden;" ><defs><filter id="wp-duotone-midnight"><feColorMatrix color-interpolation-filters="sRGB" type="matrix" values=" .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 " /><feComponentTransfer color-interpolation-filters="sRGB" ><feFuncR type="table" tableValues="0 0" /><feFuncG type="table" tableValues="0 0.64705882352941" /><feFuncB type="table" tableValues="0 1" /><feFuncA type="table" tableValues="1 1" /></feComponentTransfer><feComposite in2="SourceGraphic" operator="in" /></filter></defs></svg><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 0 0" width="0" height="0" focusable="false" role="none" style="visibility: hidden; position: absolute; left: -9999px; overflow: hidden;" ><defs><filter id="wp-duotone-magenta-yellow"><feColorMatrix color-interpolation-filters="sRGB" type="matrix" values=" .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 " /><feComponentTransfer color-interpolation-filters="sRGB" ><feFuncR type="table" tableValues="0.78039215686275 1" /><feFuncG type="table" tableValues="0 0.94901960784314" /><feFuncB type="table" tableValues="0.35294117647059 0.47058823529412" /><feFuncA type="table" tableValues="1 1" /></feComponentTransfer><feComposite in2="SourceGraphic" operator="in" /></filter></defs></svg><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 0 0" width="0" height="0" focusable="false" role="none" style="visibility: hidden; position: absolute; left: -9999px; overflow: hidden;" ><defs><filter id="wp-duotone-purple-green"><feColorMatrix color-interpolation-filters="sRGB" type="matrix" values=" .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 " /><feComponentTransfer color-interpolation-filters="sRGB" ><feFuncR type="table" tableValues="0.65098039215686 0.40392156862745" /><feFuncG type="table" tableValues="0 1" /><feFuncB type="table" tableValues="0.44705882352941 0.4" /><feFuncA type="table" tableValues="1 1" /></feComponentTransfer><feComposite in2="SourceGraphic" operator="in" /></filter></defs></svg><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 0 0" width="0" height="0" focusable="false" role="none" style="visibility: hidden; position: absolute; left: -9999px; overflow: hidden;" ><defs><filter id="wp-duotone-blue-orange"><feColorMatrix color-interpolation-filters="sRGB" type="matrix" values=" .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 " /><feComponentTransfer color-interpolation-filters="sRGB" ><feFuncR type="table" tableValues="0.098039215686275 1" /><feFuncG type="table" tableValues="0 0.66274509803922" /><feFuncB type="table" tableValues="0.84705882352941 0.41960784313725" /><feFuncA type="table" tableValues="1 1" /></feComponentTransfer><feComposite in2="SourceGraphic" operator="in" /></filter></defs></svg><div class="site" id="page"> <!-- ******************* The Navbar Area ******************* --> <header id="wrapper-navbar"> <a class="skip-link visually-hidden-focusable" href="#content"> Skip to content </a> <nav id="main-nav" class="navbar navbar-expand-md navbar-dark bg-primary" aria-labelledby="main-nav-label"> <h2 id="main-nav-label" class="screen-reader-text"> Main Navigation </h2> <div class="container"> <!-- Your site branding in the menu --> <a href="https://iipimage.sourceforge.io/" class="navbar-brand custom-logo-link" rel="home"><img width="79" height="77" src="https://iipimage.sourceforge.io/wp-content/uploads/2018/04/iip.png" class="img-fluid" alt="IIPImage" decoding="async" /></a> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation" > <span class="navbar-toggler-icon"></span> </button> <!-- The WordPress Menu goes here --> <div id="navbarNavDropdown" class="collapse navbar-collapse"><ul id="main-menu" class="navbar-nav ms-auto"><li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2802" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home menu-item-2802 nav-item"><a title="About" href="https://iipimage.sourceforge.io/" class="nav-link">About</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2801" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2801 nav-item"><a title="Blog" href="https://iipimage.sourceforge.io/blog" class="nav-link">Blog</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2804" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2804 nav-item"><a title="Demos" href="https://iipimage.sourceforge.io/demo" class="nav-link">Demos</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2805" class="menu-item menu-item-type-post_type menu-item-object-page current-page-ancestor current-menu-ancestor current-menu-parent current-page-parent current_page_parent current_page_ancestor menu-item-has-children dropdown active menu-item-2805 nav-item"><a title="Documentation" href="#" data-toggle="dropdown" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="dropdown-toggle nav-link" id="menu-item-dropdown-2805">Documentation</a> <ul class="dropdown-menu" aria-labelledby="menu-item-dropdown-2805" > <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2812" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2812 nav-item"><a title="Getting Started" href="https://iipimage.sourceforge.io/documentation/getting-started" class="dropdown-item">Getting Started</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2813" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2813 nav-item"><a title="Server" href="https://iipimage.sourceforge.io/documentation/server" class="dropdown-item">Server</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2820" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2820 nav-item"><a title="Images" href="https://iipimage.sourceforge.io/documentation/images" class="dropdown-item">Images</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2815" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2815 nav-item"><a title="Protocol" href="https://iipimage.sourceforge.io/documentation/protocol" class="dropdown-item">Protocol</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-3262" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3262 nav-item"><a title="IIIF" href="https://iipimage.sourceforge.io/documentation/iiif" class="dropdown-item">IIIF</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-3434" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3434 nav-item"><a title="Image Security" href="https://iipimage.sourceforge.io/documentation/image-security" class="dropdown-item">Image Security</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2814" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-18 current_page_item active menu-item-2814 nav-item"><a title="Viewers" href="https://iipimage.sourceforge.io/documentation/viewers" class="dropdown-item" aria-current="page">Viewers</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2816" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2816 nav-item"><a title="IIPMooViewer" href="https://iipimage.sourceforge.io/documentation/iipmooviewer" class="dropdown-item">IIPMooViewer</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2817" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2817 nav-item"><a title="IIPZoom" href="https://iipimage.sourceforge.io/documentation/iipzoom" class="dropdown-item">IIPZoom</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2818" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2818 nav-item"><a title="Troubleshooting" href="https://iipimage.sourceforge.io/documentation/troubleshooting" class="dropdown-item">Troubleshooting</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2819" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2819 nav-item"><a title="Analytics" href="https://iipimage.sourceforge.io/documentation/analytics" class="dropdown-item">Analytics</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2811" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2811 nav-item"><a title="History" href="https://iipimage.sourceforge.io/documentation/history" class="dropdown-item">History</a></li> </ul> </li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2807" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2807 nav-item"><a title="Links" href="https://iipimage.sourceforge.io/links" class="nav-link">Links</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2806" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2806 nav-item"><a title="Download" href="https://iipimage.sourceforge.io/download" class="nav-link">Download</a></li> <li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-2803" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2803 nav-item"><a title="Contact" href="https://iipimage.sourceforge.io/contact" class="nav-link">Contact</a></li> </ul></div> </div><!-- .container(-fluid) --> </nav><!-- #main-nav --> </header><!-- #wrapper-navbar --> <div class="wrapper" id="page-wrapper"> <div class="container" id="content" tabindex="-1"> <div class="row"> <div class="col-md content-area" id="primary"> <main class="site-main" id="main"> <article class="post-18 page type-page status-publish hentry" id="post-18"> <header class="entry-header"><h1 class="entry-title">Viewers</h1></header><!-- .entry-header --> <div class="entry-content"> <p>IIPImage is a client / server system. The IIPImage server streams images to the client application, typically embedded within a web page. There are several clients to choose from in either Javascript (IIPMooViewer), Flash (IIPZoom) or Java (JIIPImage). Alternatively, images can be dynamically resized, cropped and exported.</p> <h2>IIPMooViewer</h2> <p>IIPMooViewer is a high performance <a href="http://www.mootools.net">Mootools</a> based Ajax Javascript client. See the <a href="/documentation/iipmooviewer">IIPMooViewer page</a> for more details.</p> <h2>IIPZoom</h2> <p>IIPZoom is a flash client with smooth fast zooming and panning. See the <a href="/documentation/iipzoom">IIPZoom page</a> for more details.</p> <h2>JIIPImage Java Client</h2> <p>The client is written in Java and communicates directly with the server to request portions of the image at the desired resolution. It is able to efficiently cache image tiles and provies a very fast interface to the high resolution image.</p> <h3>Usage</h3> <p>The client can either be used as an applet embedded within a web page or as a standalone application. For applet use, the following parameters must be supplied:</p> <pre class="brush: xml; title: ; notranslate" title=""> <pre><object classid = "clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" codebase = "http://java.sun.com/update/1.5.0/jinstall-1_5-windows-i586.cab#Version=1,5,0,0" width="600" height="400" > <param name="type" value = "application/x-java-applet;version=1.5" /> <param name="code" value="iipimage.jiipimage.JIIPView" /> <param name="archive" value="jiip-view.jar" /> <param name="codebase" value="." /> <param name="serverName" value="http://<em>YOUR_SERVER_HERE/fcgi-bin/iipsrv.fcgi" /> </param><param name="imageName" value="<em>/YOUR/PATH/TO/IMAGES/image.tif" /> <param name="cache" value="1000" /> <comment> <embed type = "application/x-java-applet;version=1.5" \ code = "iipimage.jiipimage.JIIPView" \ archive = "jiip-view.jar" \ codebase = "." \ width = 600 \ height = 400 \ pluginspage = "http://java.sun.com/products/plugin/index.html#download"> serverName = "http://<em>YOUR_SERVER_HERE</em>/fcgi-bin/iipsrv.fcgi" \ imageName = "<em>/YOUR/PATH/TO/IMAGES/image.tif</em>" \ cache = "1000" \ <noembed> alt="Your browser understands the <applet> tag but isn't running the applet, for some reason." Your browser is completely ignoring the </applet><applet> tag! </applet></noembed> </embed> </comment> </param></object> </pre> <p>Alternatively, the client can be used in standalone mode like this:</p> <pre>java JIIPView http://address/iipsrv.fcgi /path/image.tif</pre> <h2 id="#cvt">Dynamic Image Export</h2> <p>It is also possible to dynamically export resized or cropped versions of image by using parameters in your URL with the <a href="../protocol">IIP protocol</a> <code>CVT=JPEG</code>. JPEG images can be instantly generated for any region within the image at the requested size. This is useful for many purposes, such as generating low resolution views or thumbnails of high resolution content and could also be used to <a href="/2012/08/responsive-images-using-iipimage/">create responsive images</a>.</p> <p>The <code>FIF=image</code> command specifies the absolute path to the image on the server machine and <code>WID=width</code> or <code>HEI=height</code> specify the width or height respectively. In the following example, a JPEG image of 400 pixels in width is generated from a source TIFF image located at <code>/tmp/test.tif</code> on the IIP server machine (note that CVT=jpeg must always be the final parameter):</p> <pre><img src="/fcgi-bin/iipsrv.fcgi?FIF=/tmp/test.tif&WID=400&CVT=jpeg" /></pre> <p>If both WID and HEI are specified, the output image will maintain aspect ratio and fit the image within the box defined by the given width and height. This dynamic resizing can also be used for responsive images.</p> <p>As well as specifying the size directly within the URL, forms can be used to give the user some choice over the final image size and JPEG quality. In this case, simply create form inputs with the values for FIF, WID, QLT and CVT. For example:</p> <pre class="brush: xml; title: ; notranslate" title=""> <form action="/fcgi-bin/iipsrv.fcgi" method="get"> <input type="hidden" name="FIF" value="/tmp/test.tif" /> <input type="text" name="WID" /> <input type="text" name="QLT" /> <input type="hidden" name="CVT" value="JPEG" /> </form> </pre> <p>To specify a particular region, use the <code>RGN=left,top,width,height</code> command where the left,top,width and height are defined as floating point numbers between 0 and 1. So, if you want the image to be the middle 50% of the image, use:</p> <pre><img src="/fcgi-bin/iipsrv.fcgi?FIF=/tmp/test.tif&WID=400&RGN=0.25,0.25,0.5,0.5&CVT=jpeg"/></pre> <h2 id="client">3rd Party Viewers</h2> <p>The IIPImage server can also be used with a number of other 3rd party viewers. The server can be used with any viewer that supports either the IIIF, Zoomify or DeepZoom protocols.</p> <p>For IIIF-based clients, use an image path of the form (and see <a href="/2014/12/iiif/">this blog post</a> for more information on IIIF use):</p> <pre>/fcgi-bin/iipsrv.fcgi?IIIF=/your/image/path.tif</pre> <p>For Zoomify-based clients, use an image path of the form:</p> <pre>/fcgi-bin/iipsrv.fcgi?Zoomify=/your/image/path.tif</pre> <p>For DeepZoom, add a <em>.dzi</em> suffix to the path name:</p> <pre>/fcgi-bin/iipsrv.fcgi?DeepZoom=/your/image/path.tif.dzi</pre> </div><!-- .entry-content --> <footer class="entry-footer"> </footer><!-- .entry-footer --> </article><!-- #post-18 --> </main> </div><!-- #primary --> </div><!-- .row --> </div><!-- #content --> </div><!-- #page-wrapper --> <div class="wrapper" id="wrapper-footer"> <div class="container"> <div class="row" itemscope itemtype="http://schema.org/Organization"> <meta itemprop="logo" content="https://iipimage.sourceforge.io/images/iip_logo.png" /> <div class="col-1 logo"><a itemprop="url" href="https://iipimage.sourceforge.io"><img alt="logo" src="https://iipimage.sourceforge.io/images/iip.png"/></a><span itemprop="name">IIPImage</span></div> <div class="col-11"> <footer class="site-footer" id="colophon"> <div class="social"> <a itemprop="sameAs" href="https://www.twitter.com/IIPImage"><i class="fa fa-twitter"></i></a> <a itemprop="sameAs" href="https://www.facebook.com/IIPImage"><i class="fa fa-facebook"></i></a> <a itemprop="sameAs" href="https://www.linkedin.com/company/iipimage/"><i class="fa fa-linkedin"></i></a> <a itemprop="sameAs" href="https://github.com/ruven/"><i class="fa fa-github"></i></a> <a href="/feed"><i class="fa fa-rss"></i></a> </div> <div class="site-info"> Copyright © 2024 Ruven Pillay. All Rights Reserved. </div><!-- .site-info --> </footer><!-- #colophon --> </div><!-- col --> </div><!-- .row --> </div><!-- .container(-fluid) --> </div><!-- #wrapper-footer --> </div><!-- #page --> <script src='https://iipimage.sourceforge.io/wp-content/plugins/syntaxhighlighter/syntaxhighlighter3/scripts/shCore.js?ver=3.0.9b' id='syntaxhighlighter-core-js'></script> <script src='https://iipimage.sourceforge.io/wp-content/plugins/syntaxhighlighter/syntaxhighlighter3/scripts/shBrushXml.js?ver=3.0.9b' id='syntaxhighlighter-brush-xml-js'></script> <script type='text/javascript'> (function(){ var corecss = document.createElement('link'); var themecss = document.createElement('link'); var corecssurl = "https://iipimage.sourceforge.io/wp-content/plugins/syntaxhighlighter/syntaxhighlighter3/styles/shCore.css?ver=3.0.9b"; if ( corecss.setAttribute ) { corecss.setAttribute( "rel", "stylesheet" ); corecss.setAttribute( "type", "text/css" ); corecss.setAttribute( "href", corecssurl ); } else { corecss.rel = "stylesheet"; corecss.href = corecssurl; } document.head.appendChild( corecss ); var themecssurl = "https://iipimage.sourceforge.io/wp-content/plugins/syntaxhighlighter/syntaxhighlighter3/styles/shThemeDefault.css?ver=3.0.9b"; if ( themecss.setAttribute ) { themecss.setAttribute( "rel", "stylesheet" ); themecss.setAttribute( "type", "text/css" ); themecss.setAttribute( "href", themecssurl ); } else { themecss.rel = "stylesheet"; themecss.href = themecssurl; } document.head.appendChild( themecss ); })(); SyntaxHighlighter.config.strings.expandSource = '+ expand source'; SyntaxHighlighter.config.strings.help = '?'; SyntaxHighlighter.config.strings.alert = 'SyntaxHighlighter\n\n'; SyntaxHighlighter.config.strings.noBrush = 'Can\'t find brush for: '; SyntaxHighlighter.config.strings.brushNotHtmlScript = 'Brush wasn\'t configured for html-script option: '; SyntaxHighlighter.defaults['pad-line-numbers'] = false; SyntaxHighlighter.defaults['tab-size'] = 2; SyntaxHighlighter.defaults['toolbar'] = false; SyntaxHighlighter.all(); // Infinite scroll support if ( typeof( jQuery ) !== 'undefined' ) { jQuery( function( $ ) { $( document.body ).on( 'post-load', function() { SyntaxHighlighter.highlight(); } ); } ); } </script> <script src='https://iipimage.sourceforge.io/wp-content/themes/understrap/js/theme.min.js?ver=1.2.2.1680034962' id='understrap-scripts-js'></script> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-26445856-1']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> </body> </html><!-- hyper cache 2024-11-26 07:31:57 -->