1. Live Demo
Zoom In : Mouse Left Button Click or Mouse Wheel Button Up
Zoom Out : Shift + Mouse Left Button Click or Mouse Wheel Button Down
Move : Mouse Drag
Zoom Out : Shift + Mouse Left Button Click or Mouse Wheel Button Down
Move : Mouse Drag
Share : Click this button to share the deep zoom data you are seeing as it is.
Full Screen Mode : in full screen mode, mouse wheel button is not available.
Mini Map Mode : Mini Map let you know where you are seeing.
1) Auto hide : if there is no change to viewport for 3 seconds, Mini Map disappears.
2) Show always
2. Intro
Deep Zoom Viewer Lite can help you to share your own 'Deep Zoom Data'
in Blog or Communities.
(Your Deep Zoom Data must be placed somewhere visitors can access on the internet)
3. Download
Version 1.4 is available now.
4. Upload DeepZoomViewer.xap...
It is enough that you has the one on your web-server.
Extra settings for IIS (If it doesn't work well)
1) Register MIME Type for XAP file extention in IIS
cf. http://simplesilverlight.wordpress.com/2008/03/07/register-xap-file-in-iis/
2) Make a Service Available Across Domain Boundaries (clientaccesspolicy.xml / crossdomain.xml)
cf. http://msdn2.microsoft.com/en-us/library/cc197955(VS.95).aspx
Extra settings for IIS (If it doesn't work well)
1) Register MIME Type for XAP file extention in IIS
cf. http://simplesilverlight.wordpress.com/2008/03/07/register-xap-file-in-iis/
2) Make a Service Available Across Domain Boundaries (clientaccesspolicy.xml / crossdomain.xml)
cf. http://msdn2.microsoft.com/en-us/library/cc197955(VS.95).aspx
5. Share
The basic HTML source for sharing is like below.
WIDTH : Viewer's width
HEIGHT : Viewer's height
VIEWER_URL : Your DeepZoomViewer.xap file's absolute path
ex> http://shiverlight.net/Sample/DeepZoomViewer.xap
INIT_PARAMS : For details, refer to next chapter.
ex> DZSource=http://shiverlight.net/MultiImage/nasacowork/info.bin,OpenAllowed=false,Toolbar=false
<object data="data:application/x-silverlight," type="application/x-silverlight-2-b2" width="{WIDTH}" height="{HEIGHT}" id="Xaml">
<param name="source" value="{VIEWER_URL}"/>
<param name="onerror" value="onSilverlightError" />
<param name="background" value="white" />
<param name="EnableHtmlAccess" value="true"/>
<param name="EnableHtmlAccess" value="true"/>
<param name="minRuntimeVersion" value="2.0.31005.0" />
<param name="initParams" value="{INIT_PARAMS}" />
<a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>
</a>
</object>
Replace Reds with valid data whatever you want and enjoy it.<param name="source" value="{VIEWER_URL}"/>
<param name="onerror" value="onSilverlightError" />
<param name="background" value="white" />
<param name="EnableHtmlAccess" value="true"/>
<param name="EnableHtmlAccess" value="true"/>
<param name="minRuntimeVersion" value="2.0.31005.0" />
<param name="initParams" value="{INIT_PARAMS}" />
<a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>
</a>
</object>
WIDTH : Viewer's width
HEIGHT : Viewer's height
VIEWER_URL : Your DeepZoomViewer.xap file's absolute path
ex> http://shiverlight.net/Sample/DeepZoomViewer.xap
INIT_PARAMS : For details, refer to next chapter.
ex> DZSource=http://shiverlight.net/MultiImage/nasacowork/info.bin,OpenAllowed=false,Toolbar=false
6. InitParams
DZSource : Deep Zoom Source's absolute path (include info.bin)
ex> http://shiverlight.net/MultiImage/nasacowork/info.bin
Title : Title of Image (URLEncoded String required.)
Author : Author of Image (URLEncoded String required.)
InitViewportWidth : Initial ViewportWidth of MultiScaleImage
InitViewportOriginX : Initial ViewportOrigin.X of MultiScaleImage
InitViewportOriginY : Initial ViewportOrigin.Y of MultiScaleImage
ex> http://shiverlight.net/MultiImage/nasacowork/info.bin
Title : Title of Image (URLEncoded String required.)
Author : Author of Image (URLEncoded String required.)
InitViewportWidth : Initial ViewportWidth of MultiScaleImage
InitViewportOriginX : Initial ViewportOrigin.X of MultiScaleImage
InitViewportOriginY : Initial ViewportOrigin.Y of MultiScaleImage
Appendix
Creating Deep Zoom Data
Using Deep Zoom Composer Beta, you can create deep zoom data from the image.
For download and details, refer to below. Thank you.
http://blogs.msdn.com/expression/archive/2008/06/06/download-expression-blend-2-5-june-2008-preview-and-deep-zoom-composer.aspx
Using Deep Zoom Composer Beta, you can create deep zoom data from the image.
For download and details, refer to below. Thank you.
http://blogs.msdn.com/expression/archive/2008/06/06/download-expression-blend-2-5-june-2008-preview-and-deep-zoom-composer.aspx
Contact : Gilbok Lee (CTO)(gilbok@live.com)